css - 如何在css3中首先使列数填充行？

Question

我在 css3 中使用 (column-count:4) 将 9 个图像放入 4 列中（这里的想法是：http: //css-tricks.com/seamless-responsive-photo-grid/）

但在我的情况下，9 张图片只适合 3 列（每列 3 列），最后一列是空的！我怎样才能让它首先填充行？

Answer 1

column-fill: balance应该做你想做的事，但这似乎在实际浏览器中不起作用。

也许 multicol 不是适合您的工具。取决于你想要做什么，也许 flexbox，或者只是 inline-block 可能会削减它？

http://jsbin.com/nobosu/1/edit?css,输出

也许这更接近你想要做的事情：http: //jsbin.com/nobosu/edit ?html,css,output

没有具体细节，很难知道要开什么药。