css - 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;
}