Есть ли способ получить «реальный» плавающий эффект с помощью flexbox и bootstrap 4 с неравными высокими элементами?

Question

Я хочу распределить неравные высокие элементы в плавающей среде с помощью начальной загрузки 4 и flexbox.

Без использования flexbox в BS4 элементы располагаются на равной высоте (<div class="row">).Применяя flexbox как <div class="row d-flex flex-wrap align-items-start">, я получаю желаемое выравнивание, но если элементы имеют неравную высоту, они - конечно - не плавают.

Есть ли способ добиться этого, чтобы выглядеть

как "прежний" BS3 bahaviour ?

Я хочу реализовать общий "алгоритм"так что я могу добавлять элементы без указания позиций явно.

Answer 1

Нет, нет способа заставить элементы flexbox плавать.

Однако вы можете переопределить display:flexbox в Bootstrap 4 row, используя d-block и использовать floatUtils .Это уже объяснялось в нескольких других вопросах.

Bootstrap 4 - я не хочу, чтобы столбцы имели одинаковую высоту Перестановка адаптивного макета Bootstrap 4 Адаптивная колонка Bootstrap Высота Пустое пространство по вертикали между столбцами в Bootstrap 4

Обратите внимание, что d-block - это адаптивный класс (d-sm-block, d-md-block и т. Д.), Который позволяет адаптивно переопределять flexboxна определенных точках останова.