html - Div 内でリンクをクリックできない - Z-Index を適用 - 変更なし

Question

私は一生、このリンクをクリックできるようにすることはできません。「lb」divの外に出すと機能します。z-index 値を適用しましたが、何も変わりません。私は髪を引き裂こうとしています。助けてください。

<div id="lb">         
  <div id="cntct">  
        <div id="map">
        <a href="http://goo.gl/maps/aoYyJ" style="position:relative; left:-5px; top:25px; z-index:250;">This is a link</a>

        </div>                 
  </div>
</div>

CSS

#lb 
{
    position:relative;
    top:-50px;
    z-index:-20;
    background-image:url(../src/images/Lbkg.jpg);
    background-repeat:no-repeat;
    height:650px;
    overflow:auto;
}

#cntct 
{
    position:relative;
    top:70px;
    background-image: url(../src/images/cntct.png);
    background-repeat:no-repeat;
    background-position:center;
    height:400px;
    width:1000px;
    margin:auto;
    z-index:-10;
}   

#map 
{
    position:relative;
    top:45px;
    left:50px;
    width:600px;
    height:400;
    z-index:5;
}

Answer 1

一番上のスタイルを外してみてください-投稿したコードだけではわかりにくいですが、divから押し出している可能性があります。つまり、他の何か(透明な)がそれを覆い、クリックを傍受しています。

firefox/chrome/etc を使用している場合は、リンクを右クリックして、要素を検査(または同様のコマンド) を試すことができます。クリックした要素が選択された状態で DOM ブラウザーを開く必要があります。DOM でリンクが選択されていない場合 (つまり、他の要素が選択されている場合)、その要素はリンクの上にあり、クリックをインターセプトします...

Answer 2

試してみてください：

#lbおよび#cntctのz-indexプロパティを削除します。