html - ul 100% 的父级

Question

我希望我的列表宽度是他父级宽度的 100%。这是我的代码:

HTML:

<div id="page">
    <ul class="tab" >

        <li class="tab1">
            <a > Overview</a>
        </li>
        <li class="tab12">
            <a > Overview2</a>
        </li>
     </ul></div>

CSS:

body>#page {
    margin: 0 auto;
    width: 980px;
    text-align: left;
    padding-bottom: 20px;

}

我尝试在 ul 元素上使用 width: 100%; 但它不起作用。我该怎么做？

Answer 1

试试这个:ul 的宽度为 100%，div 的宽度约为 980 像素。

HTML:

<div id="demo">
    <ul>
        <li>One</li>
        <li>Two</li>
        <li>Three</li>
    </ul>
</div>

CSS:

div#demo {
    width:980px;
}

div#demo ul {
    width:100%;
}

div#demo li {
    display:inline-block;
    width:33%;
}

http://jsfiddle.net/EU65T/