Bootstrap行离开了一个奇怪的空隙

Question

我的布局中有一个容器，它有3列，应该有很多元素。

如果所有元素都具有相同的高度，它看起来非常好，但如果其中一个具有不同的高度，它将移动整个行而不是一列。

它的外观如下：

这应该是这样的：

我如何使用bootstrap（v3）？

这是我的HTML

Answer 1

要实现这一点，如果你不想在元素中有一个固定的高度，我认为你应该遵循基于列的策略而不是基于行的策略，因为你的cols没有相同的高度，所以当浮动时打破你真正想要的通量。

但是如果你想让它像你的设计一样，我建议使用JavaScript。

Answer 2

我和Bootstrap有同样的问题。

这是因为每个框中都有不同数量的内容。使用CSS修复它的一个好方法是检查元素并获取最大元素的高度。然后添加

min-height: //whatever the height of the largest element ;

到你的元素类。如果你这样做的话，他们都会坐得很好。