http://carettaworkspace.spirecms.com
在 IE 8 中，幻灯片右侧按钮内的文本和缩略图堆叠在可以单击以控制幻灯片的空白区域之上。在其他浏览器中，整个区域都可以在按钮内单击以更改幻灯片。
我知道 IE 7 和 8 在 Z-index 堆叠方面很特别，并且我尝试了许多常见的修复方法（为父 div 设置 z-index，以不同方式定位父 div），但我我无法解决问题。有谁知道可以解决此问题的解决方案？
所以您知道，幻灯片的文本和图像位于 slidethumbs div 下。空链接可以在slidearea->anythingControls div下找到。
非常感谢任何帮助。谢谢！
【问题讨论】：
标签： javascript html css z-index
解决方案分为两部分：首先，我需要稍微重新排序 HTML 以将两个问题层放在同一个父 div 下。这允许我为父 div 和子 div 设置 z-index 以使 IE 玩得更好。其次，我发现 IE 不允许空 div 在文本或图像上方运行！诡异的。所以，我最终给了 div 一个 1px x 1px 不重复的背景图像，所以它在技术上并不是完全空的。这完全解决了这个问题，并且 IE8 允许 div 位于图像和文本区域的上方。
【讨论】：
 添加到div
如果不重新订购一些 HTML / CSS，我认为您无法做到。没有在 IE 中（在 mac 上）看过它，但这里是解释：
在 IE 中，堆栈上下文由 anything 定义，并设置了position。所以你的.anythingSlider 定义了一个堆叠上下文，你的导航不能超过缩略图。
基本上，z-index 只会上升到最近的具有堆叠上下文的元素。在大多数浏览器中，上下文由具有 (positioning + z-index) 或 (opacity
仅供参考，我通常会在设置了定位的所有东西上设置z-index: 1。处理起来有点烦人，但所有浏览器的行为都是一样的。
【讨论】：