0

我有一个水平导航,我想要一个水平子导航脱落。问题是我有子导航显示内联,而它有一个绝对位置。我知道当你有一个绝对位置时使用内联显示会有问题。它可以在固定显示器上按我想要的方式工作,但我不希望它被固定......有谁知道这个的替代方案?此外,我不能只在子导航上设置宽度,因为每个子菜单的宽度都会不同。

<style>
     ul li {
        float: left;
        position: relative;
    }

    #primary-nav ul li ul {
        position: relative;
        top: 42px;
        display: none;
        width:100%;

    }
    #primary-nav ul li ul li {
        list-style:none outside none;
        margin-left:20px;
        float:left;
        z-index: 1000;
    }
    #primary-nav ul li:hover ul {
        display:inline;
        position:absolute;
    }
</style>


<ul class="menu">
    <li>menu Item</li>
    <li>drop down</li>
        <ul class="submenu">
            <li>dropdown Item</li>
            <li>dropdown Item</li>
        </ul>
 </ul>
4

1 回答 1

3

这是解决方案的修补程序-> http://tinkerbin.com/NlqcJcL7

通过应用white-space: nowrap绝对定位的 .submenu,您可以确保它的子内联块不会折叠到下一行。

于 2012-07-02T21:30:19.680 回答