Как задать отступы у флекс элементов?

Question

[vvanyazz]

Заметил что проф. верстальщики делают отступы у флекс карточек у которых flex-wrap: wrap через space-between и получается такая картина

Но если заказчик решит добавить карточек, получится такое:

Так вот, как лучше задать через space или придумывать какие-то идеи для отступов

Comments

[Rustam Bainazarov]

Grid-column-gap и grid-row-gap — как сделать на flex-box?

[vvanyazz]

Рустам Байназаров, Я задаю таким же способом, как вы указали(width: calc(50% - 15px);),
просто не пойму, зачем делать проф. верстальщики делают через space, если элементы могут добавлять

[Rustam Bainazarov]

vvanyazz, так профессиональные верстальщики могут сделать либо зная, что там 100% не будет больше или меньше блоков, либо же потому, что они непрофессионально отнеслись к данной задаче.

[vvanyazz]

Рустам Байназаров, Спасибо ВАМ! <3

[Лев Александров]

vvanyazz, еще можно как в бутстрапе создать оболочку для каждого item'a и ей прописать padding по бокам и margin сверху и снизу и также отрицательный margin у родителя.

[vvanyazz]

Лев Александров, раньше так же делал, спасибо за ответ

[Лев Александров]

vvanyazz, какой же способ лучше?

[vvanyazz]

Лев Александров, да кто знает, много способ есть и каждый для кого-то лучше)

[Ankhena]

Лев Александров, лучше использовать для этого гриды...

Но если всё же флексами, то явно не громоздить лишних оберток.

Answer 1

[Elena Fire]

Здесь карточки не только встают по краям контейнера, но еще и наезжают на верхние карточки.
Лучше бы здесь использовать grid. Если все же flex, то width: calc(XX%-XX);