水平列表自动换行

Question

所以我有一个带有 4 个 itme 的 ol。当没有足够的空间显示所有这些时，我希望它换行到下一行，但只在列表的中心

所以我有

<ol>
<li>A</li>
<li>B</li>
<li>C</li>
<li>D</li>
</ol>

它像这样显示，

A B C D  

但是，当我缩小页面时，我希望它像

A B
C D

而不是

A B C
D

所以我需要在BC之间放一些东西，但我不知道是什么。感谢您的任何帮助！

Answer 1

您可以像这样编写标记：

.HTML

<ol>
 <ul>
    <li>A</li>
    <li>B</li>
 </ul>
 <ul>
    <li>C</li>
    <li>D</li>
 </ul>    
</ol>

.CSS

ol li{
    width:150px;
    background:red;
    text-align:center;
    float:left;
}
ul{
    float:left;
    overflow:hidden;
}

检查此 http://jsfiddle.net/nkAtV/1/