有没有办法让flexbox和bootstrap 4具有不相等的高元素来“真实”浮动？

Question

我想在带有Bootstrap 4和flexbox的浮动环境中排列不相等的高元素。

在不使用BS4中的flexbox的情况下，元素以相等的高度（<div class="row">）排列。应用<div class="row d-flex flex-wrap align-items-start">之类的flexbox可以达到所需的对齐方式，但是，如果元素的高度不相等，则它们当然不会浮动。

有没有办法做到这一点

like the "former" BS3 bahaviour吗？

我想实现一个通用的“算法”，以便我可以添加元素而无需显式指定位置。

Answer 1

不，没有办法让flexbox项浮动。

但是，您可以使用display:flexbox并使用float utils来覆盖Bootstrap 4 row上的d-block。这已经在其他几个问题中得到了解释。

Bootstrap 4 - I don't want columns to have the same height
Rearranging responsive Bootstrap 4 grid layout
Bootstrap Responsive Columns Height
Empty vertical space between columns in Bootstrap 4

请注意，d-block是一个响应类（d-sm-block，d-md-block等），它允许您在特定的断点处响应性地覆盖flexbox。