我正在开发一个带有地图的应用程序，角落里有一个 div，里面有一些东西。您可以单击此地图以在一个小窗口中显示一些信息。在某些情况下，窗口被角落的 div 覆盖。
我想要相反的效果（窗口覆盖 div）。我认为这只是一个 z-index 问题，但我无法让它工作。这是 IE7 的情况，从阅读的角度来看，z-index 似乎不起作用，除非它位于定位的元素内部。
元素似乎定位正确以使 z-index 正常工作，但我运气不佳。我玩过通过 Firebug 添加样式，但没有任何改变任何东西的运气。窗口实际上只是两个 div，一个是绝对定位的，一个是相对的。
z-index 是这里唯一可能出现问题的地方，还是还有其他我不知道的地方？
还有其他方法可以达到我想要的效果吗？我不能简单地通过 jquery 或其他方式隐藏 div，因为它的一部分应该从地图上打开的窗口后面可见。
【问题讨论】：
很简单，HTML 文件中元素的顺序将决定堆叠顺序。如果您希望一个元素高于另一个元素，请确保它位于 HTML 的后面。
您只能交换所有在同一个包含元素中的元素的堆叠顺序。例如，如果您有两个 div 并且它们都包含 3 个图像，则您不能使第二个 div 中的图像低于第一个 div 中的图像。
如果您需要复杂的堆叠顺序，则需要提前规划 HTML。
【讨论】：
几天前我遇到了同样的问题，发现 Darko Z 建议的负边距效果很好。 （我的代表还不够好，无法投票给达科）
我写了一篇关于它的快速帖子。
http://www.swards.net/2009/03/layering-html-elements-without-using.html
【讨论】：
如果您想要一个更懒的答案，您可以使用 javascript 并在您单击地图时隐藏 div，并在您关闭地图时显示它。
无论如何，您都必须对页面上的任何选择执行此操作，因为它们不适用于 z-index。
【讨论】：
您遇到了堆栈上下文错误
http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html
IE 中每个定位的 div 都会创建一个新的堆叠上下文，并防止 z-index 不同的堆叠上下文叠加到其他上下文之上。
解决方案是让您想要的窗口在树的顶部（例如进入正文），并且 z-index 值大于覆盖窗口的其他 div 的所有父级的 z-index。
在这里了解问题的广泛信息： http://richa.avasthi.name/blogs/tepumpkin/2008/01/11/ie7-lessons-learned/
【讨论】：
正如其他答案所暗示的，position:relative 和 position:absolute 重置了 IE 中的“stacking-context”。
【讨论】：
据我所知，定位和负边距是让元素重叠的唯一方法。 z-index 只是用来明确告诉浏览器如何对元素进行分层。
至于您的问题，IE 要求容器元素和/或您重叠的元素具有 position:relative; 或 position:absolute; 以使 z-index 正常工作。当有人说定位时，他们通常暗示在 CSS 中设置了 position 属性。此外，在使用 z-index 时，请确保重叠的 elementa 彼此处于同一级别。
希望对你有帮助
【讨论】：