А если одну и ту же задачу можно решить и с помощь Grid и Flex то какому способу прибегнуть?

Question

[Сергей Ракипов]

А если одну и ту же задачу можно решить и с помощь Grid и Flex то какому способу прибегнуть

Comments

[Михаил]

1. Которое будет работать
2. Которое будет легко поддерживать

[Ankhena]

А еще эту же задачу наверняка можно решить инлайн блоками, таблицами, флоатами, абсолютами и наверное, чем-нибудь еще.
Почему про них ничего не спрашиваете?

Что больше нравится, так и решайте.
Без указания задачи вопрос не очень корректный.

Answer 1

[Рома Зварич]

Rachel Andrew, одна из разработчиков спецификации, указывает на ориентиры при выборе способа в зависимости от ситуации

Основное отличие, как описано здесь, заключается в том, что Flexbox является одномерным. Это означает, что он имеет дело с выравниванием содержимого в одном измерении - как строка ИЛИ как столбец. Grid двухмерный, он одновременно контролирует выравнивание в строках и столбцах.

https://rachelandrew.co.uk/archives/2017/05/09/ref...

Answer 2

[yadscreech]

Какое для тебя удобнее и быстрее, и тут нужно на конкретном примере, нет такого что, либо Flex, либо Grid, просто комбинируй правильно и будет тебе счастье)

Comments

[Сергей Ракипов]

так вот и хочется понять на что нужно ориентироваться что бы правильно выбирать и комбинировать.

[yadscreech]

Сергей Ракипов, выше ответили, если тебе нужно что-то расположить в одну строку или столбец - Flex, если нужно что-то на подобии сетки - Grid

Answer 3

[Дмитрий]

Поддержка Flexbox браузерами на текущий момент получше, чем Grid:
https://caniuse.com/#feat=flexbox
https://caniuse.com/#feat=css-grid
В остальном выше уже написали. Задачи у технологий несколько разные: флексы выравнивают контент, гриды позволяют работать с модульной сеткой веб-страницы. Сетку можно успешно реализовать и на флексах, просто CSS Grid специально заточена под это и более гибка.