Что делать, если мобильный дизайн сильно отличается?

Question

[Посторонним В.]

Дизайнер нарисовал макеты - desktop, tablet, mobile. Tablet - просто немного адаптированная версия десктопа, а вот в мобильной версии всё совершенно по-другому. Например, в хедере изменена последовательность элементов, поиск свернут в иконку и т. д.




Вопрос - как такое верстать?

Я верстаю non mobile first, без бутстрапа, без flexbox, на SCSS.
В таких случаях обычно создают отдельную мобильную версию сайта? Или добавляют две версии хедера в HTML, одну скрывая? Просто иначе мне приходится фигачить всё абсолютным позиционированием, и это решение кажется таким себе...

Comments

[Алекс Глебов]

тут через order все можно поменять

[Посторонним В.]

Алекс Глебов, я же пишу - без flexbox

[Владимир]

Посторонним В., и зря

[Алекс Глебов]

Посторонним В., так добавьте. у флекса с префиксами нет проблем на мобильных браузерах.

[Ярослав Иванов]

На тостер зачем пишете ? С дизайнером общайтесь.

[Ankhena]

без flexbox,

В вашем случае порядок элементов и float'ом решится.

Только не понятно, почему не использовать предназначенное для этого свойство order.
Зачем городить огород из абсолютов, флоатов или двойных шапок.

Answer 1

[hellcaster]

Взять flexbox, mobile first, побольше денег с заказчика и с радостью в глазах делать. Больше нет вариантов