Почему не работает width у дочерних элементах flex?

Question

[Alex_87]

Добрый день! Столкнулся с проблемой... дочерние flex элементы вообще не реагируют на width. Ниже, привожу код! Прошу помочь разобраться, почему так происходит.
https://codepen.io/Alexei_87/pen/BeRqgO?editors=1111
P.S. Обратите внимания, что при width: 700px у элемента с классом row-block по факту 232px

Comments

[FeST1VaL]

чет у меня нету вашего кода... пойду расширения отключать... мб посчитало и заблочило...

[Alex_87]

Артем Будин, Прошу прощения, забыл добавить изначально) Теперь он есть!

Answer 1

[AbcEnt03]

Потому что у тебя max-width:1160px;
1160 / 5 = 232 px; flex делит ширину для всех поровну, ты задал width:700px; для .row-block - это даже 2 блока в ряд не поместится поэтому flex делит свою максимальную ширину на 5 блоков. если хочешь чтобы они перемещались в низ добавь flex: wrap;

Comments

[Alex_87]

Добавил flex-wrap:wrap но не помогло! Решение найдено в flex-basis!

[Alex_87]

А как выравнять flex элементы по горизонтали внутри класса .row-block?