Вёрстка на flex, space-between и выравнивание по левому краю. Внимание вопрос?

Question

[IvanDe83]

Имеется что-то вроде фото галереи jsfiddle.net/IvanDe/mqv5e7aq

Можно ли средствами html-css с использованием flexbox и space-between (нужна респонсивность) сделать так, чтобы в нижнем ряду все элементы были выровнены по левому краю? Примерно, как здесь jsfiddle.net/IvanDe/5mwduzm3

Спасибо.

Comments

[Lynn «Кофеман»]

stackoverflow.com/a/22018710/1016033

Answer 1

[IvanDe83]

Костыль за буграми уже придумали, тем проблема решена. Всем спасибо, особенно первому комментатору: stackoverflow.com/questions/18744164/flex-box-alig...

Answer 2

[Вадим Белкин]

С использованием justify-content: space-between; никак. Обычно в таких случаях используют простую адаптивную сетку с выравниваем по левому краю, ширина колонок задается в процентах, а отступы между колонок либо через margin либо padding.

Comments

[IvanDe83]

При этом сценарии получаются отсупы от правого (левого) края сайта. С помощью justify-content: space-between удаётся лего от них избавиться.

[Вадим Белкин]

IvanDe83: эти отступы компенсируются за счёт отрицательных боковых margin у контейнера. Посмотрите построение сеток у популярных фреймворком, например bootstrap getbootstrap.com/css/#grid-example-basic