CSS垂直堆栈

Question

我目前有一堆水平堆叠的inline-blockdiv。当容器已满时，它们很好地溢出到下一行：

是否可以在不更改HTML的情况下垂直执行相同的操作？

要生成此图片，我必须将每列移动到一个容器div。我无法修改源HTML，所以这不是一个选项。

CSSDesk

Answer 1

CSS2
唉，据我所知，这是不可能的纯CSS和HTML。我知道有一个jQuery插件Masonry，虽然这很好。

CSS3
使用CSS3's Multi-column Layout Mode就可以达到这个问题的布局（尽管它会不会有很多的选项，上述砖石）。 IE支持从10岁起，我认为，你可能需要一些浏览器前缀。非前缀的版本会是这个样子（你的容器上）：

column-count: 3; 
column-gap: 10px; 
width: 480px; 

以上改编自this blogpost链接到this demo（虽然有are others太）。

Answer 2

根据浏览器支持，您可以使用column-count。