css - 另一个 <ul> 内的 <ul> 继承样式

Question

我在一些 HTML 中有以下结构:

<ul class="li_inline">
    <li>
        <ul class="li_block">
            <li>Stuff</li>
            <li>Stuff under stuff</li>
        </ul>
    </li>
    <li>
        <ul class="li_block">
            <li>Stuff</li>
            <li>Stuff under stuff</li>
        </ul>
    </li>
</ul>

使用这样的 CSS:

.li_inline li
{
    display: inline;
}

.li_block li
{
    display: block;
}

我希望发生的是拥有两个内部 <ul>并排，但任何 <li>它们内部的 s 位于彼此下方。这样我就可以并排获得侧边栏和主体，但其中的元素表现正常(即一个在另一个之下)。

有人可以建议我使用一些 CSS 以便内部 ( li_block ) 列出' <li>元素显示为 block 元素，但 <ul> s 本身并排显示吗？

谢谢

詹姆斯

Answer 1

使用重置规则。

ul ul { list-style:none; padding: 5px 20px; margin: 5px 10px; }

在您的情况下，使用 !important 可以完成您的工作。但尽量不要使用它

更新

解决方案:http://jsfiddle.net/Starx/KHjmP/ (FF3+、Safari 4+、IE8+)