仅使用CSS3进行Pinterest样式堆叠

Question

是否可以在仅使用css的页面上进行pinterest样式布局/堆叠项目？

我想CSS3可能有一些东西可以用列来做这种布局。

我已经阅读了一个教程，但它需要使用javascript和绝对定位来进行堆叠。

Answer 1

您可以使用CSS3列。它将垂直堆叠项目。 http://jsfiddle.net/qLVXQ/

div.pinterest {
    width: 400px;
    column-count: 4;
    column-gap: 0;
}
div.pinterest > div {
    display: inline-block;
    vertical-align: top;
    width: 100px;
}