z-index 似乎不起作用

Question

在我的网站上，我建立了一个带有链接的页面： https://weerpagina.warnez.com/links/ 一切正常，直到我添加了子菜单（参见 'webcams'），当您将鼠标悬停在菜单项上时，子菜单会显示，但一部分隐藏在页脚后面。结构（带 z-indexes，仅在我的开发环境中）如下：

<div id="wrapper"> --> z-index:1;
   <header>...</header> --> z-index:100;
  <div id="main">...</div> --> z-index:50
  <footer>...</footer> --> z-index: 1
</div>

子菜单（来自 "main"）仍然隐藏在页脚后面。

我尝试添加到 "main"、'overflow:visible' 并且成功了，除了它的结果是我的管理区域中的一些表在 X 方向溢出，这是一种不需要的行为。然后我尝试了 overflow-x:scroll 和 overflow-y:visible，但显然当你设置 overflow-y:visible 时，overflow-x 会自动自动。所以这也行不通。（参见 overflow-y:visible not working when overflow-x:hidden is present）。无论如何，我更喜欢通过z-index解决它。

非常感谢任何帮助！

亲切的问候，

巴特

Answer 1

我认为“#main”有 "overflow:auto" 并且将菜单保留在里面。

您应该忽略管理区域，或者您可以在 "body" 应用一些全局类名来区分管理和前端。

然后保留管理页面的溢出设置，并在前端制作#main overflow:visible。

z-index 似乎不起作用

z-index doesn't seem to work

css

z-index

overflow