子菜单在悬停时位于主菜单后面

Question

我在this上有my site响应式Joomla模板，我无法设置下拉菜单。它总是在主菜单后面，也在滑块后面。我已经尝试过z-index和相对位置，但仍然无法正常工作。有人知道为什么或我错过了什么？

HTML

<div id="nav">
<div class="inner clearfix">
    <ul class="nav menu">
        <li class="item-101 current active">Main menu 1</li>
        <li class="item-112">Main menu 2</li>
        <li class="item-147 deeper parent">Main menu 3</li>
            <ul class="nav-child unstyled small">
                <li class="item-151">Submenu 1</li>
                <li class="item-152">Submenu 2</li>
            </ul>
    </ul>
</div>

Answer 1

将此添加到导航栏中：

#nav {
    z-index: 10000;
    position: relative;
}

z-index会将其推到body元素上方，需要position: relative才能使z-index生效。