CSS 使用一个类向左堆积 block

Question

这可能是一个非常基本的问题，但我无法让它发挥作用。我希望所有 div 向左倾斜，直到达到主 div 的高度并转到下一行。

使用float:left，我得到左边的结果(如下图)

如何使用将应用于每个 div 元素的通用 css 类实现右侧的结果？

Answer 1

看起来你正在尝试做类似于砌体的事情。有几种方法可以做到这一点。如果您要拥有动态数据，我建议您使用 css 列。这里有一个选项:http://css-tricks.com/seamless-responsive-photo-grid/

这里也有一个类似的问题，有一个很好的 jqueury 答案:How to Create Grid/Tile View with CSS?

如果您没有动态数据，并且它们都将是静态的，那么最好对您的行进行绝对定位，并根据需要进行偏移。这是一个简单的 jfiddle 示例:

   <a href="http://jsfiddle.net/PhantomDude95/j9GbG/"> http://jsfiddle.net/PhantomDude95/j9GbG/ </a>