使用Bootstrap创建类似Pinterest的网格:框不会显示在彼此正下方

Question

HTML方案如下:

<div class="items">
  <div class="item">...</div>
  <div class="item">...</div>
  <div class="item">...</div>
  ...
</div>

.item CSS风格:

float: left;

结果如下:

但是白盒子并没有一个接一个地对齐 - 这可能是问题所在？我也试过用display: inline-block;而不是float: left;,但结果基本相同.

谢谢

Answer 1

您可以使用CSS 3 column-width并column-gap像这样..

http://www.bootply.com/118335