Как так расположить блоки с помощью flex?

закинь в codepen и дай ссылку

1,2 блок, сделай им обёртку.
4,5 тоже оберни.
И все встанет. flex-direction, justify-content, сам додумай:)

mrlag, Еще бы не помешало использовать wrap. И думаю можно даже без обертки, если использовать column

Виталий, 1,2 в любом случае надо обернуть, иначе не встанет.
Column? Кому?
Тут row, flex-wrap: wrap; (для контейнера)
И можно попробовать не оборачивать 4,5 блоки.

mrlag, я не хотел трогать html, но да: обертка этих двух блоков решает проблему. Спасибо!

mrlag, Вам бы тоже не помешало флексы подучить:

Виталий, а... нет. вы не правы. нельзя трогать порядок div.

qqignatqq, Вы не поверите, но и это не проблема:

Виталий, ну тогда я снимаю шляпу и прошу добавить свой ответ в "ответ", а в не комментарий

Виталий, я был близок к этому варианту. Просто не рассматривал margin-left. У меня из-за justify-content: space-between; всё сыпалось

qqignatqq, Я как-то не планировал делать, просто хотел навести на мысль)

qqignatqq, Да, тут нюанс в том что justify-content: space-between; будет работать в другом направлении, поэтому margin auto

Виталий,
ну как сказать, вариант, но не работоспособный.
переполнение контента не будет работать, если отпустим фиксированную высоту, и сделаем min-height, то вся сетка поломается.
И что проще? добавить 1 обертку, или играться с отступами и с перспективой сломаной сетки?

mrlag, Если говорить о подходе, тогда гриды будут более актуальны оберток, так что не надо притягивать за уши проблемы. Вы сказали что оборачивать нужно в любом случае, я доказал что это не так и в рамках поставленной задачи все более чем работоспособно.

Ок, ок, работает, не спорю!
Но что проще?) И главное, работоспособней:)
Человек в свой проект возьмёт данный вариант, а потом аукнется:)
Ладно, дискуссия пустая.

mrlag,

Но что проще?) И главное, работоспособней:)

Гриды

Человек в свой проект возьмёт данный вариант, а потом аукнется:)

У человека есть задача, я предоставил решение. Более того я без проблем могу представить пару вариантов где такой подход будет более чем самодостаточен. Кроме того это не просто решение, а возможность понять на практике, что возможно сделать и как. Вы вот своим ограниченным знанием flex не смогли догадаться, что можно применить column, так что пусть остальные тоже живут в неведении?

Это как вчера в теме спрашивали, как сделать чтобы элементы обтекали блок и переносились на новую строку. Люди уже о float забыли, а вы упрекаете пример раскрывающий потенциал флексов.