Question

我在<nav id="hoz-menu">内的WordPress标题中添加了一个水平菜单我不知道哪个CSS语句使菜单超出了块。假设菜单的CSS是响应式的。演示可以从http://jsfiddle.net/yckelvin/nqx2a1ao/

找到

以下是Chrome调试http://screencloud.net/v/Ernf

的截屏

以下是菜单的HTML代码

<nav id="hoz-menu">
    <ul id="hoz-menu" class="topmenu">
        <li class="topfirst"><a href="#" style="height:16px;line-height:16px;"><span>Item 1</span></a>
        <ul>
            <li><a href="#">Item 1.1</a></li>
            <li><a href="#">Item 1.2</a></li>
        </ul></li>
        <li class="topmenu"><a href="#" style="height:16px;line-height:16px;"><span>Item 2</span></a>
        <ul>
            <li><a href="#">Item 2.1</a></li>
            <li><a href="#">Item 2.2</a></li>
            <li><a href="#">Item 2.3</a></li>
            <li><a href="#">Item 2.4</a></li>
            <li><a href="#">Item 2.5</a></li>
        </ul></li>
        <li class="topmenu"><a href="#" style="height:16px;line-height:16px;">Item 3</a></li>
        <li class="topmenu"><a href="#" style="height:16px;line-height:16px;">Item 4</a></li>
        <li class="topmenu"><a href="#" style="height:16px;line-height:16px;">Item 5</a></li>
        <li class="topmenu"><a href="#" style="height:16px;line-height:16px;">Item 6</a></li>
        <li class="toplast"><a href="#" style="height:16px;line-height:16px;">Item 7</a></li>
    </ul>                   
</nav>

<nav id="hoz-menu">的宽度为420px，CSS为

{
    display: block;
}

<ul id="hoz-menu" class="topmenu">

的CSS

#hoz-menu ul#hoz-menu, ul#hoz-menu ul {
margin: 0;
list-style: none;
padding: 0;
background-color: #dedede;
border-width: 1px;
border-style: solid;
border-color: #5f5f5f;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}

在定义了特定宽度的DIV中无法显示菜单

0 个答案: