在div中包装列表

Question

我有一个div，我在div中有一个列表。我希望div中的列表看起来像这样：

Item 1    Item 5    Item 9

Item 2    Item 6    Item 10

Item 3    Item 7    Item 11

Item 4    Item 8    Item 12

我理解使用display：inline-block我可以这样做，

Item 1 Item 2 Item 3 Item 4
Item 5 Item 6 Item 7 Item 8

但是我想让列垂直移动，然后在div结束后再从下一列的顶部开始（如上所示）。 div有一个固定的高度。没有任何显示，文本就会超出div。

谢谢！

Answer 1

@urgenthhelp;你可以使用css3 columns count属性。

<强> CSS

ul {
    -moz-column-count: 3;
    -moz-column-gap: 10px;
    -webkit-column-count: 3;
    -webkit-column-gap: 10px;
    column-count: 3;
    column-gap: 10px;
}
li{margin-bottom:10px}

检查此http://jsfiddle.net/sandeep/Qnsqm/可能对您有所帮助。