同样在<li> children </li> </ul>中共享<ul>的宽度

Question

  

可能重复：
  HTML List element : Sharing the parent width into equal parts

我的div包含ul元素：

<div style="width: 800px">
    <ul style="width: 100%">
        <li>...</li>
        ....
        <li>...</li>
    </ul>
</div>

如何在li中自动为ul元素提供相等的空间？

Answer 1

如果您希望水平跨越列表，这应该足够了：

HTML
<div>
    <ul id="list">
        <li><a href="#">Item one</a></li>
        <li><a href="#">Item two</a></li>
        <li><a href="#">Item three</a></li>
        <li><a href="#">Item four</a></li>
        <li><a href="#">Item five</a></li>
    </ul>
</div>

CSS
#list li
{
    display: inline;
    list-style-type: none;
    padding-right: 20px;
}

在这种情况下，我调整填充以按照我希望的方式均匀地跨越项目。

Answer 2

我会用这个css：

 #list li
{
    display: inline;
    list-style-type: none;
    padding-right: 20px;
    ***width:100px;***
}