下拉菜单中的项目不可见

Question

有人可以告诉我，我该如何修复下拉菜单？某些项目不可见，因为菜单位于两行，第二行隐藏项目位于下拉菜单中。我认为很好的解决方案将使用css代码，但我不知道如何。

Answer 1

将z-index和top属性添加到ul.sub-menu，该广告在悬停时消失，

更新 - 只需按照Praveen Kumar的建议更改z-index。因此，如果将顶级属性添加到ul.sub-menu，某个地方会破坏您的结构。

  

z-index：z-index CSS属性指定a的z顺序   定位元素及其后代。当元素重叠时，z顺序   确定哪一个覆盖另一个。一个更大的元素   z-index通常涵盖较低元素的元素。

.navbar-inverse .navbar-nav ul.sub-menu {
    display: none;
    position: absolute;
    top: 100%;
    background: #fff;
    width: 200px;
    box-shadow: 3px 3px 2px rgba(50, 50, 50, 0.08);
    top: 35px; /*Add this*/
    z-index: 9; /*Add this*/
}

Answer 2

这是一个z-index问题，您没有为子菜单指定z-index。修复是添加以下CSS以将z-index设置为子菜单：

.navbar-inverse .navbar-nav li:hover > ul.sub-menu {
  z-index: 9999;
}

预览