Question

Is it possible to do a pinterest style layout/stacking of items on a page with css only?

I imagine CSS3 might have something that could do this kind of layout with columns perhaps.

I’ve already read a tutorial, but it requires using javascript and absolute positioning to do the stacking.

Answer 1

You can use CSS3 columns. It will stack the items vertically. 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;
}