Адаптивная верстка, как можно решить данную проблему?
Всем доброго времени суток, суть проблемы в следующим!
Зайдем из далека! Есть 3 вида макетов 480, 768, 960! Проблема в том, что при разрешение меньше 480px верстка начинает потихоньку ехать, я хочу узнать, можно ли, как-нибудь зафиксировать верстку (если ширина устройства меньше 480px) и смаштабировать ее на 320-ти пикселях (ну или какое там разрешение будет), то есть засунуть 480px в 320px или 360px. То есть, что я хочу по сути, надо чтобы на устройствах ≤ 480px показывалась минимальная верстка в 480px. Если просто ставить min-width 480px, то появляется скролл, на меньших устройствах, а он ни есть хорошо! Выручайте ребята, может есть у кого какие идеи? Использую foundation!
Serj-One: То есть если в верстке присутствуют костыли, то это уже не адаптивная верстка? Мда... По поводу, как сделать правильно, я писал, мне не нужен четвертый медиа запрос, мне нужно просто грамотно смаштабировать при определенных условиях, это весь смысл моего вопроса, если не найду грамотного решения, то придется пилить под 320. Я хочу узнать есть ли какие-либо способы решения моего вопроса.... Это все, что я хочу узнать из заданного мной вопроса...
Тимофей Белоусов: мне этот метод удобен тем, что до 480 пикселей в ширину можно писать медиа, а меньше контент не помещается, или еще что-то явно мешает (формы, изображения, етц), и проще сайт в целом вмещать в окно просмотра/устройства. А эту задачу уже можно переложить на само устройства - телефоны умные, масштабировать умеют.
Serj-One: А чем собственно плох такой метод??? Я себя считаю не плохим специалистом, не претендую на какиe-либо звания типа Senior, я просто знаю своё дело и если мне, что-то интересно, я считаю нужным это выяснить. Правильно Ксения написала, есть такие элементы, которые просто физически не подходят под 320px. Кстати не красиво кидать камни в чужой огород....
на 480px верстка должна стать статической. То есть не проценты, а пиксели должны быть значениями ширины, высоты и т.д. В калькуляторе перегоните из процентов в пиксели. И еще viewport scale на всякий случай посмотрите
Делайте резиново + относительные единицы измерения.
Например использовать em везде, тогда при ширине меньше 480 можно просто изменить размер шрифта у body и все блоки станут меньше.
