内联时LI标签堆叠的问题

Question

在我引入<br>标记和另一行内容之前，这样可以正常工作。内联<li>标记最终会堆叠。

<ul style="list-style:none;">
    <li style="display:inline;border:1px solid red;">
    C
    <br>A
    </li>
    <li style="display:inline;border:1px solid red;">
    B
    <br>D
    </li>
    <li style="display:inline;border:1px solid red;">
    A
    <br>E
    </li>
</ul>

Answer 1

如果您希望所有列表项都在一行上，而在第二行上休息，则可以尝试使用以下内容浮动它们：

li {
    float: left;
}

JSFiddle here