Bootstrap float从左到右

Question

对于我的项目,我正在使用bootstrap.

我试图显示从左到右漂浮的div,所以我做了

<div class="row">
  <div class="col-md-4">11111111<br></div>
  <div class="col-md-4">2222222222<br>222222222222<br></div>
  <div class="col-md-4">333333333333<br></div>
  <div class="col-md-4">444444444444<br></div>
</div>

http://www.bootply.com/yyKS8cgS4h

但正如你所看到的那样,带有4s的div不会添加到带有1s的div下,而是添加到具有3s的div下.我怎样才能修复它以便将它添加到带有1的div下？

编辑

div的数量是动态的,所以我不能把它添加到div 11111,我想要的是在pinterest.com主页上,所有的div都是从左到右添加的,每个div下都有nog大空格

为了更好地理解我的问题,我做了另一个例子

http://www.bootply.com/R3MXHJL9wM

这就是我想要做的事情,在页面上填写带有描述的图像.但我希望页面能够填充,而不会像您在示例中看到的那样存在巨大差距.

例如,图像div彼此之间没有间隙(如果你只是创建一个新行就可以获得)

Answer 1

对于有同样问题的人，我建议使用列重置

有了四层网格，您一定会遇到问题，在某些断点处，您的列不能完全正确地清除，因为一层比另一层高。要解决此问题，请结合使用 .clearfix 和我们的响应式实用程序类。