IE中的z-index问题

Question

我有一张地图，上面有点，用户可以悬停在上面以显示更多信息。

问题很难解释，因为只有当用户在IE中查看页面并且它托管在我的服务器上时，才似乎存在问题。完全相同的代码在下面的jsfiddle页面上可以正常工作。

http://jsfiddle.net/FbYEW/

当我将其托管在我的服务器上时，弹出窗口的z-index不起作用，弹出窗口显示在其他位置下面。有人能想到为什么吗...很让人沮丧，无法复制问题供任何人查看。

编辑：

我在IE8的兼容模式下查看托管在我的服务器上的页面。如果你在IE中查看jsfiddle页面，同样的问题也会发生 - 所以这与我的服务器无关...糟糕。

- Tom

---

IE8兼容性=IE7。您关心IE7用户吗？ - thirtydot

这是该网站观众的10％，因此不应忽视。 - Tom

那么请提出一个新问题，因为答案完全不同（与我对这个问题的回答不同），我现在没有时间写它。 - thirtydot

Answer 1

当从您的服务器托管时，页面在IE9标准模式之外的浏览器模式下呈现。

例如，如果它在IE7模式或Quirks模式下呈现，则会出现z-index问题。

按F12打开开发人员工具，查看是哪种模式。

有许多不同的可能性导致这种情况发生，请参见：

http://hsivonen.iki.fi/doctype/#ie8modes

如果你只是想修复它，而不想找出问题的根源：

<meta http-equiv="X-UA-Compatible" content="IE=edge">

- thirtydot

---

上面的代码行是有效的，但在实施之前我想了解为什么有效。此外，尝试修复IE7中的问题可能是更好的做法，而不是忽略它。 - Tom