purecss make .pure-menu-scrollable和pure-menu-has-children一起工作

时间:2015-05-05 07:56:58

标签: html css web yui-pure-css

实际上我想要一个带有下拉菜单的水平滚动菜单,如下所示:

<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.6.0/pure-min.css">

<div class="pure-menu pure-menu-horizontal pure-menu-scrollable pure-menu-fixed">
    <a href="#" class="pure-menu-heading">Brand</a>
    <ul class="pure-menu-list">
        <li class="pure-menu-item"><a href="#" class="pure-menu-link">Home</a></li>
        <li class="pure-menu-item"><a href="#" class="pure-menu-link">Settings</a></li>
        <li class="pure-menu-item"><a href="#" class="pure-menu-link">Log Out</a></li>
        <li class="pure-menu-item pure-menu-has-children pure-menu-allow-hover">
            <a href="#" id="menuLink1" class="pure-menu-link" name="menuLink1">Contact</a>
            <ul class="pure-menu-children">
                <li class="pure-menu-item"><a href="#" class="pure-menu-link">Email</a></li>
                <li class="pure-menu-item"><a href="#" class="pure-menu-link">Twitter</a></li>
                <li class="pure-menu-item"><a href="#" class="pure-menu-link">Tumblr Blog</a></li>
            </ul>
        </li>
    </ul>
</div>

但它不起作用。实际上水平菜单滚动工作,但下拉不起作用((我发现这是因为.pure-menu-scrollable和pure-menu-have-children类无法相处。所以此时我可以拥有或滚动菜单或者带有下拉菜单的菜单,但不能同时显示两者。

有没有办法让纯菜单既可滚动又可以下拉?

0 个答案:

没有答案