如何设置列表样式以在html中显示为两个col

Question

我有一个列表如下：

<ul>
   <li>1<li>
   <li>2<li>
   <li>3<li>
   <li>4<li>
   <li>5<li>
   <li>6<li>
   <li>7<li>
   <li>8<li>
   <li>9<li>
 </ul>

它们在输出中显示为：

1
2
3
4
5
6
7
8
9

我如何设计它们以显示为：

1      2
3      4
5      6
7      8
9

我需要一个适用于IE的解决方案，我很乐意使用JQuery。

Answer 1

执行此操作的一种方法是为每个列表项指定一个已定义的宽度，然后为整个列表指定一个等于两个列表项的已定义宽度。然后将所有列表项浮动到左侧。

CSS：

li{
    padding: 0; margin: 0;
    width: 4em;
    float: left;
}
ul{
    padding:0; margin: 0;
    width: 8em;
}​

演示：jsFiddle