Twitter bootstrap下拉菜单中的z-index问题

Question

我在页面顶部的固定导航栏中使用了twitter bootstrap下拉菜单.

这一切都很好但是在显示其他页面元素后面而不是在它们前面的下拉菜单项有问题.

如果我在页面上有任何东西position: relative(如jquery ui手风琴或谷歌图表),那么下面的菜单会显示在它后面.尝试更改z-indexdd菜单和导航栏,但没有任何区别.

我可以让菜单位于其他内容之上的唯一方法是将内容更改为position: fixed;OR z-index: -1; ,但这两种解决方案都会导致其他问题.

感谢您能给我的任何帮助.

我认为这可能是CSS定位的一些标准问题,我误解了,所以没有发布任何代码,但如果需要可以做.

谢谢.

Answer 1

刚刚意识到发生了什么.

我把导航栏放在一个标题内position: fixed;

更改了z-index标题并且它现在正在工作 - 猜测我的容器看起来不够高,无法设置z-index最初!#@ !?

谢谢.

我有一个类似的问题,结果是由父div上的"overflow:hidden"引起的.解决方案对我来说很简单,因为在查看之后,我确定我不需要溢出:隐藏了所以我将其删除了. (14认同)
@ScottForsyth-MVP 我略过你的评论思考..溢出：隐藏 - 这不是我的问题 - 我的都是关于 z-index 的。因此，我访问了 MDN 上的堆栈上下文页面（强烈推荐），并仔细浏览了我的网站，设置了位置和正确的 z 索引。菜单仍然被切断。然后我注意到溢出：隐藏在 css 检查器中，它让我想起了您的评论 - 就是这样！ (2认同)

Answer 2

Windows8上的IE 7,带有bootstrap 3.0.0.

.navbar {
  position: static;
}
.navbar .nav > li {
  z-index: 1001;
}

固定

Answer 3

在这里遇到同样的错误.这对我有用.

.navbar {
    position: static;
}

通过将位置设置为静态,这意味着导航栏将像通常那样落入文档流中.

Answer 4

这将解决它

.navbar .nav > li {
z-index: 10000;
}