鏈接不重疊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。

Answer 2

看到這個問題：Z-index broken in IE8?

而這一次

IE7/IE8 z-index problem

Answer 3

難道說你的前兩個div是postion而不是position屬性？ z-index需要非靜態定位div才能正常工作。

Answer 4

它與divs的順序有關。此外，如果您將鏈接放在另一個包含多個div的div上，則該覆蓋需要一個背景。我通常使用透明PNG。否則，瀏覽器可以看穿它（ie7等）。

問題的解決方案： http://jsfiddle.net/Anytech/Gr3ae/1/