重複しているリンクで動作していないリンク

Question

Webサイトのフッターを作成すると、重複しているDivのいくつかの奇妙な動作が発生しました。問題は、第2のリンクはIE7でクリックできないとIE8の少なくともいくつかのバージョンということである

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

の位置は：例を参照することができます。 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インデックスの親を与えて試してみてください1。

Answer 2

この質問を参照してください：-10 div要素のzインデックス：Z-index broken in IE8?

この1

IE7/IE8 z-index problem

Answer 3

position属性の代わりに最初の2つのdivにpostionが割り当てられていますか？ z-indexでは、静的に配置されたdivを正しく動作させる必要があります。

Answer 4

divの順番と関係があります。また、複数のdivを含む別のdivにリンクを張っている場合、オーバーレイにはバックラウンドが必要です。私は通常透明なPNGを使用します。さもなければブラウザはそれを見ることができます（ie7など）。問題へ

ソリューション： http://jsfiddle.net/Anytech/Gr3ae/1/