如何对齐bootstrap网格

Question

我正在尝试创建一个Twitter网格，我有一些网格跨度比其他网格跨度更大，并且在网格的每一行上，跨度被向下推。我想要做的是让项目显示在过项目下。我拍了一张它看起来像什么的屏幕截图，我已经按照我想要的方式拍照了。屏幕截图如下。

Here is the original

Here is the photoshoped

Answer 1

这是一个常见的问题，因为网格元素必须在行中，所以第一个和最后一个将分别松开左右填充。

我使用的解决方法： - 如果每行有一定数量的网格元素，那么我不包括<div class='row'>，只包括网格元素，然后删除每个第三和第四个元素的nth-child（）属性的额外填充（in案例有三个网格元素）

您也可以尝试使用masonry

Answer 2

Bootstrap网格对齐/高度问题共有3种方法。

只有这样的CSS方法..

http://bootply.com/85737

像这样的'clearfix'（响应式重置）方法（需要每x列迭代一次）..

http://bootply.com/89910

最后，您可能想要使用Isotope / Masonry插件。这是一个使用Isotope + Bootstrap的工作示例..

http://bootply.com/61482