javascript - 带有 css 的 float li 元素用于多个 Ul 元素

Question

让我们看看这段 html 代码:

<div>

    <ul>
        <li>aaa</li>
         <li>bbb</li>
         <li>ccc</li>
    </ul>

      <ul>
        <li>ddd</li>
         <li>fff</li>
         <li>eee</li>
    </ul>

</div>

结果当然可以。但是，现在我想制作所有 li ul 内的元素在这个 CSS 的帮助下水平:

li{ 
    float:left;
    list-style:none;
}

但是，结果是:fiddle

我可以添加</br>在 div 之间的。但是，这不是正确的方法。谢谢。

Answer 1

您可以内联 <ul> div中的元素。

ul {
    display:inline; 
    text-align:center; 
    margin:10px 0; // This is to avoid scrollbars in the demo, might not be necessary for you
    padding:0;
}

li {
    display:inline;
    list-style:none;
}

这是一个演示:http://jsfiddle.net/4pv6rby9/14/ .