CSSの遺跡リンク（<a>）

-2

私のページにはうまくいかなかったリンクがあります。ヘッダーのリンクは機能しますが、2番目のリンクは機能しません。私はCSSを切り取り、両方のリンクが動作します。次のCSSでは、リンクが機能しなくなる原因は何ですか？CSSの遺跡リンク（<a>）

.sidenav { 
    position: fixed; 
    height: 100%; 
    left: 0; 
    /*top set by $*/ 
    background-color: #2e2e2e; 
} 

.sidenav a { 
    display: block; 
    font-size: 24px; 
    color: white; 
    text-transform: uppercase; 
    padding-left: 15px; 
    padding-top: 15px; 
    padding-bottom: 15px; 
} 

.sidenav a:not(.disrupt):hover { 
    border-left: 2px solid #ff9500; 
    border-right: 2px solid #ff9500; 
    cursor: pointer; 
}

そしてHTML：

<body ontouchstart> 
    <div class="header"> 
    <div class="logo">Q<sup>3</sup></div> 
    <a href="http://www.google.com">hello</a> 
    <div class="desc">Quito's Qustom Qode</div> 
    </div> 

    <div class="row"> 
    <div id="content" class="col10"> 

    <div class="about"> 

     <div class="profile-back"> 
     <div class="profile"></div> 
     </div> 
    </div><!-- /about --> 
    <a href="http://www.google.com">hello</a> 
    </div><!-- /content --> 
    </div><!-- /row --> 
</body>

私はこのコードを見てきたと私はそれをやっているだろうと思ったし、何も得なかった部分をコメントしています。私はそれが（再び）私はCSSのファイルのリンクと2番目の作品をコメントアウトしたので、それがCSSであることは分かっていますが、それが追加されると失敗します。

編集：残っているCSSは、私がコメントアウトしたもので、リンクが機能しました。編集：/*top set by jQ*/がメインコンテンツを移動してリンクを切断しているようです。

出典

2017-06-23 Quito Guillermos

完全な例を見ずに言うのは難しいです。あなたのコードに[mcve] – j08691

の2つのアンカーが必要ですが、どちらが遺跡ですか？ – Syfer

a {ruin：not; } JK – sheriffderek

.headerのように見えますが、position: fixedはリンクをカバーしています。この推測を確認するには、ChromeまたはFirefoxで右クリックしてコンテキストメニューからInspectを選択し、どの要素が検査されるかを調べてください。

100％それはリンクではありません。

更新：著者のコメントをおかげで、問題は

#content { 
    position: absolute; 
    left: 16.66%; 
    padding: 10px; 
    border-radius: 25px; 
    z-index: -1; <---------- HERE 
}

z-index: -1あるbody

出典

2017-06-23 03:49:03

リンクを調べるとChromeのボディータグが与えられます –

@Quito、ありがとうございます。私は答えを更新しました。 –

'z-index'が問題でした。私は内容がヘッダーを超えていないことを確認しようとしていました。ヘッダを 'z-index：1'に変更しました。すべてがうまくいくようです。手伝ってくれてどうもありがとう。 –

-1

下#contentブロックを置く私はなぜ知らないが、.sidenav a:not(.disrupt):hoverは問題です。

出典

2017-06-23 04:06:44

問題をどのように修正しましたか？ –

@Quito、あなたは間違っています。私の更新された答えを見てください。 –

答えて

関連する問題