Есть ли способ выровнять это в флексбоксе? Есле нет, то как (гриды?)?

Question

[verycooldev]

К примеру есть лейаут - https://codepen.io/dubx/pen/MBmPGM

Третий элемент имеет высоту больше чем остальные. Как избавится от этого пустого пространства? перенести туда следующие элементы (4, 5 и тд)? Это невозможно флексом?

Как тогда, кроме флоатов?

Comments

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

Нет

[verycooldev]

Алексей Тен, печально, я так и подозревал. Получается только флоаты?

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

Более того, в общем случае только JS

[verycooldev]

Алексей Тен, в смысле JS. Абсолютное позиционирование? Да ну нах такое счастье))) А если это делать по другому, типо такого (разметка другая) Как сделать такой лейаут без флоата (на гридах)?

Там длинный компонент отдельно от всего блока мелких.

[Иван]

verycooldev, гуглите mansory сетку

[verycooldev]

Иван, боже мой, при чем тут это.

[Иван]

verycooldev, потому что это проблема относится к мансори,и сетка примерная такая

[verycooldev]

Иван, до свидания

[ⓒⓢⓢ]

Есть ли способ выровнять это в флексбоксе?

можно, если изменить разметку
пример - бутстрап сетка

[verycooldev]

JRK_DV, какой бутстрап? флоаты или флексы? Конкретнее можно?

[Dymok]

если высота блоков будет не фиксированной, то можно использовать align-items stretch контейнеру

[ⓒⓢⓢ]

verycooldev, флексы, по nested grid первый попавшийся jsfiddle.net/gd14hbya

[verycooldev]

JRK_DV, вообще мне ни о чем этот пример не говорит.

[verycooldev]

Dymok, тогда мелкие блоки вытянутся в длину по самому длинному элементу. Зачем это мне нужно? stretch это и так дефолтное значние. Я в шоке с советов.

[ⓒⓢⓢ]

verycooldev, nested сетку под свой проект ищите и не страдайте ерундой

[Dymok]

verycooldev, первый ответ тут посмотри Как создать flexible верстку?

[verycooldev]

JRK_DV, ну какой тут нестед? Где тут нестед? Что тут нестед?

[verycooldev]

Dymok, это не masonry, еще раз говорю.