twitter bootstrap 下拉菜单的 z-index 问题 [英] z-index issue with twitter bootstrap dropdown menu

问题描述

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

I'm using twitter bootstrap dropdown menu in a fixed navbar at the top of my page.

一切正常，但下拉菜单项显示在其他页面元素后面而不是在它们前面时出现问题.

It all works fine but am having issues with the drop down menu items showing behind other page elements rather than in front of them.

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

If I have anything on the page with position: relative (like jquery ui accordion, or a google chart) then the drop down menu shows behind it. Tried changing the z-index of the dd menu and of the nav-bar, but doesn't make any difference.

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

The only way I can get the menu to sit above the other content is to change the content to position: fixed; OR z-index: -1; -but both of these solutions cause other problems.

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

Appreciate any help you can give me.

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

I think this is probably some standard issue with CSS positioning that I've misunderstood, so haven't posted any code, but can do if needed.

谢谢.

推荐答案

刚刚意识到发生了什么.

Just realized what's going on.

我的导航栏位于 position: fixed 的标题中；

I had the navbar inside a header which was position: fixed;

更改了标题上的 z-index 并且它现在可以工作了 - 我猜我在容器上看起来不够高，无法最初设置 z-index ！#@！?

Changed the z-index on the header and it's working now - guess I didn't look high enough up the containers to set the z-index initially !#@!?

谢谢.

这篇关于twitter bootstrap 下拉菜单的 z-index 问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！