鏈接的可點擊區域

-1

我有一個奇怪的情況。我有一個非常奇怪的可點擊區域的簡單鏈接。我可以點擊鏈接上方和下方，但是當我將鼠標放在字母上時，我無法點擊鏈接。我試圖擴展可點擊區域，但它擴展到文本之外。所以如果用戶直接點擊鏈接的文字，什麼都不會發生。我在頁面上有一些其他鏈接，他們工作正常。所以你也許知道，這有什麼問題？鏈接的可點擊區域

<div class="row"> 
    <div class="col-md-6 col-md-offset-6"> 
     <a href="web.html" id="webMore">Erfahren Sie mehr</a> 
    </div> 
</div>

我有以下風格的鏈接。

a { 
    display: block; 
    color: $mainOrange; 
    position: relative; 
    &:hover { 
     text-decoration: none; 
     color: $hoverOrange; 
    } 
    &:visited { 
     text-decoration: none; 
     color: $mainOrange; 
    } 
    &:after { 
     top: -10px; bottom: -10px; 
     right: -10px; left: -10px; 
    } 
} 
#webMore { 
    position: relative; 
    top: 25px; 
    font-size: 25px; 
}

來源

2015-04-05 Andrej Tihonov

我沒有看到任何錯誤http://codepen.io/anon/pen/YPbwZv除非一些涉及的CSS丟失。 – 2015-04-05 13:30:34

好的，不知道是什麼問題，但是當我將z-index設置爲9999時，問題就解決了。 Thx幫助你們！ – 2015-04-05 13:47:48

請檢查其他CSS 一個元素的風格，因爲我查過你的空白頁上的代碼 - 它工作正常。

如果這不是CSS問題，請檢查您的JS腳本或HTML。

來源

2015-04-05 13:32:59

可能是您的瀏覽器完全還是不支持...你必須嘗試

-O-歌劇

-moz-爲Mozilla

-webkit-其他瀏覽器，做這樣的>

<pre> 

    a { 
    display: block; 
    color: $mainOrange; 
    position: relative; 
    -webkit-color: $mainOrange; 
    -webkit-position: relative; 


    &:hover { 
     text-decoration: none; 
     color: $hoverOrange; 
     -moz-text-decoration: none; 
     -moz-color: $hoverOrange; 
     -webkit-text-decoration: none; 
     -webkit-color: $hoverOrange; 
     -o-text-decoration: none; 
     -o-color: $hoverOrange; 
    } 
    &:visited { 
     -webkit-text-decoration: none; 
     -webkit-color: $mainOrange; 
     //same for -o- & -moz- 
    } 
    &:after { 
     top: -10px; bottom: -10px; 
     right: -10px; left: -10px; 
     //same for -o- & -moz- 
    } 
} 
#webMore { 
    position: relative; 
    top: 25px; 
    font-size:25px; 
} 
//HTML CODE AS IT IS 
    <div class="row"> 
    <div class="col-md-6 col-md-offset-6"> 
     <a href="web.html" id="webMore">Erfahren Sie mehr</a> 
    </div> 
</div> 
</pre>

來源

2015-04-05 13:50:37

鏈接的可點擊區域

回答

相關問題