html - 链接在重叠的 Div 中不起作用

Question

为网站制作页脚时，我偶然发现了一些重叠 Div 的奇怪行为。您可以在以下位置查看示例:

http://mike.latysheva.ru/test.html

问题是第二个链接在 IE7 和至少某些版本的 IE8 中不可点击。在 IE9 和 Firefox 中运行良好。

这是代码，非常简单(您可以在页面源代码中查看完整代码):

<div style="height: 120px; width: 200px; background: #DDDDDD; postion:relative;">
  <div style="height: 40px; padding: 10px;postion:relative;">
    <a ...[have to remove an actual link in order to post it here]>Test Link 1</a>
  </div>
  <div style="height: 40px; padding: 10px;postion:relative;">
     <a ...[have to remove an actual link in order to post it here]">Test Link 2</a>
  </div>
</div>
<div style="width:250px;height:100px; background:#777777;margin-top:-60px;position:relative;z-index: -10;"></div>

代码有什么问题？它与 z-index: -10 有关系吗？我完全糊涂了……请帮忙……

提前致谢!

Answer 1

尝试给 z-index:-10 div 的父级一个 z-index:1。