html - の幅を均等に共有の間で子供

Question

重複の可能性:
HTML リスト要素: 親の幅を均等に共有する

要素を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;***
}