具有特定溢出的两列列表

Question

如何创建一个简单的html / css页面，该页面可以显示包含项目列表的2列，以便第一列填满，然后流入第二列，即非平衡列高

例如：

------------------
1. John  
2. Alan  
3. Matt  

------------------
1. John  5. Suzie
2. Alan  
3. Matt  
4. Phil  
------------------
1. John  5. Suzie
2. Alan  6. Cathy
3. Matt  7. Bob
4. Phil  8. Richard
------------------

我尝试了一个列数为div的div：2;但是例如有4个项目，它会将它们分成每列中的2个项目，我希望第一列中的所有4个项目。

谢谢！

Answer 1

只需使用column-fill: auto：

-moz-column-fill: auto;
     column-fill: auto;

下次问一些问题时，请分享您的代码。