IE Quirks 模式下的 Z-index 问题答案

【问题标题】：Z-index problems in IE Quirks modeIE Quirks 模式下的 Z-index 问题
【发布时间】：2013-01-11 00:34:12
【问题描述】：

我在这个网站上工作：http://stdionis.org.uk/

在 IE 9 或更低版本中查看网站时，主页上的下拉菜单会出现在幻灯片下方（这是 google 幻灯片），但是当您转到另一个页面时，下拉菜单会出现在图片上方.

我已将下拉 div 的 z-index 设置为 9999，并尝试将幻灯片的 z-index 设置为零，但似乎无法使其工作。

我们使用的 CMS 不允许直接访问页面的 HTML 代码（不要问...），所以我只能使用 CSS 或 javascript 进行更改。因此，为什么我不能更改文档类型以使其以标准模式显示。

不一定要寻找干净的解决方案，任何疯狂的 javascript hack 将不胜感激。

【问题讨论】：

【解决方案1】：

试试这个 -

.t_horizontal * { z-index: 1000 !important; }

或

.t_horizontal table { z-index: 1000 !important; }

如果甚至不工作 - 尝试使用 jQuery -

$(document).ready(function(){
  $('.t_horizontal *').css('z-index','1000 !important');
});

注意：menu 使用的表格不是构建菜单的正确方法。

【讨论】：

谢谢，但这似乎没有用。似乎每当新图像淡入时，默认情况下它就在顶部。我知道这是糟糕的代码，我希望我可以编辑它，但不幸的是我无法访问代码并且菜单是由 CMS 自动生成的。
尝试添加这个 - #slideshow { z-index:100 } .t_horizontal, .t_horizontal *, .t_horizontal div, .t_horizontal:hover { z-index:1000 }

【解决方案2】：

你试过了吗：

#ctlHeaderModules {
  position: relative;
  z-index: 2;
}
#frm1 {
  position: relative;
  z-index: 1;
}

这两个元素处于同一级别，当我在 Chrome 中检查它们时，我没有看到任何这些属性被应用，值得一试。

【讨论】：