Как правильно перестроить элементы?

Question

[Keany]

Есть блок на макете в декстопной версии сайту, есть ли вариант чтобы верстка перестраивалась на больном расширении согласно макета чтобы не пршлось скрывать или показывать объекты?

Answer 1

[Саргис Алексанян]

Можно с помощью флексов, через свойство order, подробнее https://developer.mozilla.org/en-US/docs/Web/CSS/C...

Comments

[Keany]

order да, если бы они в одном контейнере лежали с общим flexом

[imko]

Keany, левой колонке можно display: contents кинуть, будет как в одном

[Саргис Алексанян]

Keany, так можно переделать, сделать один общий блок, внутри два блока. В одном блоке сделать кнопки с текстом, а во втором картинку. И через флекс сделать всю верстку.

Answer 2

[Ankhena]

есть ли вариант чтобы верстка перестраивалась на больном расширении согласно макета чтобы не пршлось скрывать или показывать объекты?

Да, конечно и даже не один.
Вы совершенно верно в вопросе указали теги флекс и грид. Вот с их помощью.

Флекс
Десктоп: Оборачиваем контентyю часть в div. Родителю задаем флекс. Два элемента встают в ряд.
Мобилки: для контентного div задаем display: contents, после этого он станет как будто прозрачным или как будто его нет.
Ну и дальше с помощью order расставляем элементы в нужном порядке.

Грид
Несколько вариантов.
Первый с такой же оберткой как для флекса.
Второй - все элементы россыпью и просто меняем сетку.

Comments

[Keany]

Спасибо! Вы гения))