CSS 变换 z-index 问题

【问题标题】：CSS transform z-index issuesCSS 变换 z-index 问题
【发布时间】：2014-04-15 21:33:38
【问题描述】：

当打开导航下拉菜单时，右侧边栏中的转换字体：“UNSERE HEIMSPIELE 2014”，...等kassel-titans.de 中的字体显示在导航下拉菜单上。

这是为什么呢？

【问题讨论】：

【解决方案1】：

在我看来，通过为 .GDtitans 声明 top: 16px，您就是在给该元素一个位置。 #megaMenu 有 position: relative，但都没有设置 z-index。由于 .GDtitan 元素出现在文档的后面，它们重叠#megaMenu。

尝试为两者添加 z-index，例如：

#megaMenu {
  z-index: 20;
}
.GDtitan {
  z-index: 10;
}

现在#megaMenu 将具有更高的 z-index，并将与其他所有内容重叠。

【讨论】：

【解决方案2】：

通过删除下面（或使用所需的值）

-webkit-backface-visibility: 隐藏；

来自您的 GDtitans 课程，它将解决您的问题。

【讨论】：

【解决方案3】：

您应该在导航 div 上使用 z-index 而不是仅在 ul 上

div#navigation{
   position: relative;
   z-index: 1;
}

应该没问题

【讨论】：