Вопросы с меткой [адаптивная-верстка]

Процесс форматирования веб-страниц, адаптированных под экраны любых размеров.

Фильтрация
Сортировка
Метки
0 голосов
2 ответа
122 показа

Шаблон Bootstrap 3

Шаблон Bootstrap. На мониторе разрешением больше 900px - хорошо смотрится, а именно миниатюры записей выводятся в три столбика. Если уменьшить разрешение экрана меньше 900px, то вёрсткой предусмотрено ...
Валерий Емельянов's user avatar
0 голосов
4 ответа
102 показа

Не получается добавить фон справа при ховере строки таблицы выбивающийся за ее край

Приветствую всех! У меня есть табличка, хочу с помощью стилей сделать так, чтобы при наведении на каждую из строк фон ховера распространялся за таблицу влево и вправо на 20px в пределах контейнера. ...
Вася's user avatar
  • 4,482
-1 голос
1 ответ
739 показов

Не получается свернуть меню в бутерброд

Приветствую. У меня бутстраповское меню, хочу при уменьшении экрана сворачивать его в бутерброд. Не могу понять почему не работает.. Вот фидл. В описании бутстрапа есть такая строчка: Внимание! ...
Вася's user avatar
  • 4,482
0 голосов
2 ответа
377 показов

Вопрос по расположению блоков - наползают друг на друга

Нужно сделать так, чтобы в зависимости от разрешения экрана, блоки (могут быть разной высоты в зависимости от содержимого) выстраивались все время в аккуратные ряды друг за другом, и не наползали друг ...
Вася's user avatar
  • 4,482
0 голосов
1 ответ
66 показов

Проблема с отступами между Div'ми

Суть проблемы : Есть 2 дива (Content и footer). Мне бы хотелось добавить margin-bottom к "Content", но что-бы отступ был от "Footer", а у меня получается отступ от края страницы, что в итоге поднимает ...
SpiritCow's user avatar
1 голос
1 ответ
2k показов

Почему не работает col-sm-offset-1?

Приветствую. Есть хедер, в нем лого и две картинки в ряду с надписью. Пытаюсь с помощью бутстраповской сетки сделать адаптивные блоки, чтобы они красиво складывались между собой. колдую с отступами ...
Вася's user avatar
  • 4,482
0 голосов
1 ответ
2k показов

Убрать горизонтальный скролл на android с фиксированным body

Заданы медиа запросы @media only screen and (min-width: 480px) and (orientation: landscape) @media only screen and (min-width: 768px) Суть первого запроса в том, чтобы отображать ту версию сайта, ...
Elena Semenova's user avatar
0 голосов
3 ответа
676 показов

Как убрать промежутки между горизонтальными li?

Как избавится от промежутков между горизонтальными li? * { margin: 0; padding: 0; } .svg-icon { width: 64px; height: 64px; display: inline-block; } .rect { width: 100%; ...
vas's user avatar
  • 1,767
0 голосов
1 ответ
33 показа

Возможно ли при помощи инструментов эмулирующих отображение на различных устройствах создать работающие приложение?

После того, как я узнал, что в chrome и firefox есть "эмуляторы различных устройств" мне стало интересно, возможно ли при помощи их создать работающие "не криво" приложение? Но это не все... У меня ...
vas's user avatar
  • 1,767
0 голосов
1 ответ
89 показов

Добавить адаптивного слайдер на адаптивный сайт

Для сайта был задан свой скрипт адаптивности - вызов функций AddressSwitcher(); fixMobileSafariViewport(); CasesLogo(); Затем был добавлен адаптивный слайдер OwlCarusel - http://owlgraphic.com/...
Elena Semenova's user avatar
0 голосов
1 ответ
282 показа

Как решить проблему с адаптивной версткой?

Используется бутстраповский шаблон. Он был натянут на wordpress и дальше я принялся его редактировать. На сайте необходимо в первой секции сделать у <div> фоном видео. Там, где стандартно фоном ...
Kuznetsov Maxim's user avatar
1 голос
1 ответ
898 показов

Как сделать css анимацию адаптивной по ширине?

Код на codepen - codepen.io/Andrey-m/pen/QjypPV?editors=110 Пытаюсь освоить анимацию css Помогите поправить код, чтобы сохранить адаптивность. У меня при уменьшении окна по ширине все рушится. ...
Андрей's user avatar
0 голосов
2 ответа
137 показов

Почему меню на адаптивной верстке скрыто?

Всем добрый вечер! Столкнулся с проблемой, при переносе html шаблона на CMS возникла проблема с меню. Оно не открывается на мобильном разрешении. Что-то блокирует. Буду чрезмерно благодарен, если ...
Benjamin Button's user avatar
0 голосов
2 ответа
759 показов

Верстка под Ipad

Добрый вечер, а возможно запретить Ipad вертикальное отображение сайта? Имеется ввиду, что при вертикальном положении Ipad, сайт не переворачивался, не масштабировался, отображался только ...
Pro mark's user avatar
0 голосов
2 ответа
499 показов

Почему в мобильной версии белые отступы по бокам?

В версии для экранов 320px если открывать с телефона, то почему-то по бокам экрана белые отступы, что естественно быть не должно. В чем здесь может быть причина?
user avatar
1 голос
2 ответа
842 показа

Вопрос по перемещению блоков при адаптиве

Допустим в версии для декстопа есть блок текста, под ним блок картинок, а под ним блок музыки. Так вот, а как сделать чтоб на мобильной версии блок картинок оказался в самом верху, а после него уже ...
user avatar
9 голосов
2 ответа
1k показов

Галерея с изображениями разными по ширине

Как реализовать галерею с изображениями, разными по ширине, но фиксированными по высоте? Необходимо, чтобы изображения сами распределялись и ужимались в зависимости от места в блоке div. Есть скрипт ...
dikardRus's user avatar
  • 298
1 голос
2 ответа
200 показов

Верстка макета, простая задача, но мозг отказывается работать

Доброго времени суток! То ли лето, то мне пора в отпуск, но что-то я заглумился с одним макетом. Дизайнеры люди творческие, и всякие штуки придумывают, вот попался мне макет и ломаю голову я, хотя ...
DexColt's user avatar
  • 323
2 голоса
2 ответа
6k показов

Контент на всю ширину экрана в адаптивной версии

Добрый день, уважаемые специалисты. Я в ступоре, ибо не могу понять как работает адаптивность на моем сайте. Итак, что я делаю: В хедере есть следующее: <meta name="viewport" content="width=...
Seredniy's user avatar
  • 529
0 голосов
1 ответ
164 показа

Объясните плз, как получается квадратная область?

Вот тут http://jsfiddle.net/8m71qb16/ комрад soledar10 показывает как поместить изображение в квадратную область. div.s{ max-width: 33%; } div.s figure{ padding-top: 100%; /* 300px/300px = 1 ...
DenniLa2's user avatar
  • 362
2 голоса
4 ответа
37k показов

Как разместить в ряд три изображения в квадратных областях

Мне нужно расположить три изображения в квадратных областях в ряд так, что бы при изменении ширины браузера квадраты оставались квадратами. Три квадратных изображения должны всегда занимать всю ...
DenniLa2's user avatar
  • 362
0 голосов
1 ответ
77 показов

Адаптивная верстка уже обязательна или все еще по желанию? [закрыт]

Не совсем ясно с "адаптивной версткой". Ведь теперь чаще просматривают сайты с мобильного устройства - значит надо это учитывать всегда. Если с планшетами нет особых проблем, то на сматфонах требуется ...
Peter Pan's user avatar
2 голоса
3 ответа
7k показов

background-size: cover - не правильно работает на мобильных девайсах

Здравствуйте, уважаемые знатоки! Такая проблемка: на некоторых мобильных девайсах, фон прорисовывается не полностью... .header { height: 565px; background: url(/style/client/img/bg.png)no-...
bpigadip's user avatar
0 голосов
1 ответ
77 показов

Куда в файл JavaScript вставлять проверку на браузер?

Делаю простенький сайт с адаптивным дизайном через Adobe Edge Animate. В папке сайта имею три файла JavaScript: index_edge, index_edgeActions и index_edgePreload. Скачал код для проверки на браузер (...
Виктор Макурин's user avatar
2 голоса
2 ответа
43k показов

Медиа-запросы не работают

Здравствуйте! Помогите, пожалуйста, советом: пытаюсь с помощью медиа-запросов отрегулировать ширину шапки и контента, но не выходит. Мне нужно, чтобы если экран устройства менее 1024 px, поля не ...
Регина's user avatar
-7 голосов
1 ответ
476 показов

Верстка сложных интерфейсов без css [закрыт]

Существует ли возможность верстать очень сложные интерфейсы без привлечения css? Если такая возможность существует и не одна, то какая лучшая? Если не понятно о чем я, то хочется следующее - ...
vas's user avatar
  • 1,767
0 голосов
3 ответа
716 показов

Как растянуть сайдбар до футера?

css html Не работают: min-height: 100%; height: 100%; Как растянуть сайдбар до футера?
user avatar
0 голосов
1 ответ
654 показа

bootstrap блоки

Вопрос такой, почему в коде, содержащем 2 блока: <div class="container-fluid"> <div class="row"> <div class="col-sm-6"> <p>1 блок <...
AlexeyAl's user avatar
  • 783
2 голоса
1 ответ
577 показов

Адаптивный дизайн - колонки

Здравствуйте. Возникла такая проблема: на сайте есть две колонки. Одна - sitebar - фикс. размер (254px), а вторая - динамический размер (max-width: 1100px min-width: 668px). Помогите реализовать (в ...
PostMix's user avatar
  • 115
0 голосов
1 ответ
6k показов

Ширина блока на оставшуюся ширину страницы

Вопрос болезненный для меня. Вот есть контейнер, на всю ширину страницы, есть блоки внутри: от одного до нескольких — с шириной, меняющейся в зависимости от контента, а последний — должен заполнять ...
densmith's user avatar
  • 525
2 голоса
1 ответ
3k показов

Как сделать адаптивные фоновые изображения, как на fl.ru

Хочу сверстать этот макет. При масштабировании фоновое изображение масштабируется не пропорционально. Хочу, как на fl.ru: ссылка, ссылка. Хотел изучить исходный код fl.ru, но там очень много ...
neoman's user avatar
  • 87
1 голос
1 ответ
154 показа

Как оформить ряд со спанами визуально как таблицу?

Bootstrap 2 3 2 Как оформить ряд со спанами визуально как таблицу? Задача сделать таблицу, и самое простое решение сделать ее, как обычную таблицу. Вот так она выглядит: Я хочу, чтобы при маленькой ...
mr_blond97's user avatar
4 голоса
1 ответ
262 показа

Как сверстать border, аналогичный комбинации fieldset и legend?

Как сверстать такой border? Сайт на bootstrap, то есть он не должен сползать. Сейчас сверстан с помощью legend и fieldset, что не поддерживается в ie8 и ранних версиях opera. http://v.testjay.esy.es/
Руслан Сабанов's user avatar
0 голосов
2 ответа
4k показов

Как задать цвет элемента select > option при наведении на него курсора?

select содержит option, нужно задать цвет при наведении на option курсора, для примера, на картинке у option'а как-то задан оранжевый бэкграунд и белый color < select> < option>1< /...
mr_blond97's user avatar
0 голосов
2 ответа
414 показов

Как правильно уменьшить ширину span'а?

Bootstrap 2.3.2 Как правильно уменьшить ширину span'а? Например, есть span8, я хочу, чтобы он был поуже, но не настолько узкий, как span7. Для примера на картинке span8 ofset2, мне нужно, чтобы ...
mr_blond97's user avatar
2 голоса
2 ответа
562 показа

Начальное масштабирование не адаптивной верстки на смартфонах

Здравствуйте. Сайт сверстан не адаптивно, но для некоторых элементов прописано особое поведение на смартфонах через media queries (часть элементов скрывается, изменяется лейаут и т.п.). Задан <meta ...
rebroff's user avatar
  • 453
0 голосов
0 ответов
1k показов

Как сделать адаптивный слайдер?

Можно ли как-то при помощи CSS сделать подобный слайдер адаптивным/резиновым? Пример Сколько гуглил готовые решения для изменения размеров контейнера используют JS...
Bromez's user avatar
  • 1
4 голоса
2 ответа
901 показ

Медиа-запрос или аналог относительно родителя, а не вьюпорта или экрана

Имеется вот такой блок: Хотелось бы сделать так, чтобы при достаточности ширины он трансформировался в такой блок: Как писать свойства - понятно: заменить инлайн-блоки на блоки, добавить отступы и т....
Cypher's user avatar
  • 2,573
1 голос
2 ответа
1k показов

Выравнивание сетки из li элементов

Здравствуйте. Столкнулся с проблемой. Есть каталог картинок, реализованный списком <ul>. Блок, содержащий их, - резиновый, поэтому возникает проблема центирования этого списка. Если делать через ...
ДМитрий's user avatar
0 голосов
2 ответа
348 показов

Как управлять расположением блоков при адаптивной верстке ?

Есть 3 блока, они все стоят в ряд. При ресайзе на определенное разрешение нужно взять центровой блок и поместить вперед, остальные два под него, вот таким образом. Возможно ли такое реализовать без ...
Nepster's user avatar
  • 1,269
0 голосов
2 ответа
8k показов

Изменение класса элемента при изменении разрешения экрана

Ребята, всем привет! Занимаюсь версткой проекта, адаптивного, и потребовалось сделать так, чтобы при разрешении экрана менее 700 пикселей, у одного элемента менялся класс (при этом у него задано 2 ...
funfot's user avatar
  • 1
5 голосов
1 ответ
1k показов

Диагональный слайдер контента

Приветствую, знатоки. Пришла ко мне задача запилить вот такой слайдер: На удивление, гугл ничем мне не помог, поэтому прошу помощи у вас. Может кто встречался с аналогичной задачей или может ...
Vladimir Glushkov's user avatar
1 голос
1 ответ
2k показов

Позиционирование плиткой картинок без пробелов

Доброго времени суток, уважаемый Хэшкод и его участники! У меня возникла новая задача, заказчик поставил задачу реализовать такую штуку. Мне интересно есть ли алгоритмы такие, специальные, которые ...
IntegralAL's user avatar
  • 2,699
1 голос
1 ответ
261 показ

Изображение бэкграунда под мобильные устройства

Добрый день. Подскажите как сделать, чтобы бэкграунд автоматом растягивался либо под альбомное разрешение экрана, либо под портретное. Сейчас при перевороте экрана в мобильных устройствах картинка, ...
Romancho's user avatar
  • 349
2 голоса
1 ответ
230 показов

Верстка адаптивного сайта

Народ всем привет, нужна помощь. Верстаю сайтик с адаптивным дизайном через @media запросы, все норм получается но проблема появляется тогда когда сайт открывают на телефоне. Минимальная ширина сайта ...
Антон Шелестов's user avatar
0 голосов
1 ответ
1k показов

Адаптивные изображения

День добрый. Есть слайдер с 10 img. Все изображения "альбомноориентированные" (ширина больше высоты). Необходимо, чтобы изображения пропорционально растягивались по ширине и высоте окна браузера (на ...
Romancho's user avatar
  • 349
1 голос
1 ответ
1k показов

Страница сайта как будто немного сдвинута влево на мобильный устройствах

Из-за чего страница сайта может быть как будто немного сдвинута влево на мобильный устройствах так, что справа пустое пространство образуется в 10-20 px. На десктопе всё нормально отображается!
Александр Тимофеев's user avatar
1 голос
1 ответ
190 показов

Как следать сайт "несужаемее" определенного числа пикселей?

У меня есть сайт. И когда я сужаю окно браузера более чем до 800 пикселей, скажем, начинает вториться безобразие. Как сделать так, чтобы он перестал сужаться в этой точке? Пробовал добавить невидимый ...
jackair's user avatar
  • 297
0 голосов
2 ответа
294 показа

Как верстать сайт, который дизайн как одна картина

Здравствуйте, возможно я не правильно выразил вопрос, дело в том что есть есть сайт, на котором элементы дизайна не должны выходить за пределы размера браузера (http://василийпупкин.рф/ нив коем ...
bemulima's user avatar
  • 1,918
2 голоса
1 ответ
321 показ

Манипуляции с блоками

Подскажите, пожалуйста, как реализовать такой момент: есть блок, он делится на 3 секции. 1 секция это виджиты по левому краю (например статистика, топ и тп),2секция - правый блок точно так же, а по ...
Nepster's user avatar
  • 1,269