Question

我认为标题令人困惑，所以我将解释这个问题：我有固定位置的菜单，这必须保持这种方式。问题出在菜单底部的所有子项目 - 它们都不可见。我为你准备了jsfiddle： jsfiddle

如果你徘徊在Travel li上，你将只能看到2个sub li，如果他们更多，他们会隐藏... 问题是，是否有可能改变子订单的位置，所以如果底部的子列表上升，如果它是一个顶级子列表，那么列表将转到底部？请访问jsfiddle以更好地了解问题..

html是：

<div id="menu" style="display: block;">
    <h2>Browse our categories</h2>
    <div id="nav">
        <ul id="catmenu">
            <li class="main"><a href="accountants">Accountants</a>
                <ul class="subul">
                    <li><a href="travel-2">Accountants1</a></li>
                    <li><a href="travel-agents">Accountants2</a></li>
                    <li><a href="travel-agents">Accountants3</a></li>
                </ul>

            </li>
            <li class="main"><a href="automotive">Automotive</a></li>
            <li class="main"><a href="building">Building</a></li>
            <li class="main"><a href="business-services">Business services</a></li>
            <li class="main with"><a href="travel">Travel</a>
                <ul class="subul"><li><a href="travel-2">Travel 1</a></li>
                    <li><a href="travel-agents">Travel agents2</a></li>
                    <li><a href="travel-agents">Travel agents3</a></li>
                </ul>
            </li>
        </ul>
    </div>
</div>

Answer 1

如果您向上一个ul添加一个类，比如.dropup，那么可以为ul添加自定义CSS：

ul.subul.dropup{top:auto;bottom:0;}

这将使最后一个菜单项的底部与菜单底部对齐。

请参阅demo。

CSS当菜单位置固定时如何显示菜单子菜单

1 个答案: