Flex-box Как пофиксить нижний ряд, чтобы он не растягивался?

Question

[rsoinvi]

Использую флексбокс

main_container{
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
}

Comments

[Dymok]

В каком плане пофиксить? Если нужно, чтобы они выстраивались по левому краю - задать justify-content: flex-start

[rsoinvi]

Dymok, я хочу что бы нижний ряд не растягивался по в сей ширине а начинался с левой стороны с интервалами

[Сергей Попов]

rsoinvi, посмотрите, как это сделано в bootstrap 4.
Есть вариант сделать еще один блок, который займет оставшуюся ячейку. Но это костыль.
Правильно задавать маргины для блоков, а не использовать space-between.

Answer 1

[Дмитрий Новиков]

В Вашем случае действительно нужно для контейнера задать flex-start, а уже для элементов придется попотеть с расчетом ширины в зависимости от количества элементов в строке и отступов между ними. Либо заглянуть сюда и стянуть мой рабочий пример на scss. В примере просто поменяйте две переменные, количество столбцов и величину отступа