問題與IE瀏覽器使用顯示器時：塊鏈接

這是我的HTML：問題與IE瀏覽器使用顯示器時：塊鏈接

<div id="links"> 
    <a href="">Link 1</a> 
    <a href="">Link 2</a> 
    <a href="">Link 3</a> 
    <a href="">Link 4</a> 
</div>

而這些CSS樣式：

#links { 
    position: absolute; 
    border: 1px solid #000; 
} 

#links a { 
    display: block; 
} 

#links a:hover { 
    background-color: #CCC; 
}

這將顯示一個鏈接列表，問題是，在IE中，我只能通過直接點擊文本鏈接來點擊一個鏈接，而其他瀏覽器則不是這種情況（無論文本鏈接還是其他任何地方，只要它位於鏈接塊中就可以點擊任意位置），有沒有修復（只有CSS，沒有JavaScript）？

請注意，我不想爲鏈接或div指定寬度。

來源

2009-05-19 Waleed Eissa

將鏈接文本括在span元素中。然後它會接受在其範圍內任何地方的點擊。

來源

2009-05-19 08:44:36

非常感謝，工作。 – 2009-05-19 08:50:25

這種解決方案不僅僅是增加位置的語義：相對 – vsync 2009-05-19 20:56:13

把位置：相對;在你的CSS在#links一個{}

like this

它會解決它:)

來源

2009-05-19 20:55:09 vsync

優秀的技巧，謝謝！ – Yukulelix 2013-02-18 13:45:40

我有以上爲我工作了同樣的問題，並沒有解決方案。我還需要鏈接的背景是透明的。

一個非常不舒服的解決方案，但完美的工作是將背景設置爲透明gif。只需要1x1像素，因爲它會重複。

#links a 
{ 
    display: block; 
    background: url(/images/interface/blank/1dot.gif); 
}

這似乎沒有任何副作用，除了一個額外的請求到服務器。

來源

2010-04-24 10:40:45

同樣在這裏。其他解決方案不起作用，但這是一個。 – 2011-03-04 04:00:54

請注意，您可以[在CSS中對GIF的內容進行硬編碼]（http：// css-tricks。com/snippets/html/base64-encode-of-1x1px-transparent-gif /），從而避免了服務器上的額外請求！ – Benjamin 2013-03-06 00:41:28

我不知道爲什麼，但給錨點一個背景色似乎爲我解決了這個問題。

來源

2012-04-12 17:52:14 Andrew

我也是，但我只是試圖將其作爲一個快速嘗試（與其他答案相比），它很好地工作。只需放入一個`background-color：transparent`即可解決問題。 +1 – 2012-05-14 12:52:28

-1

插入此您a - 標籤樣式裏面：

background:url('images/dot.png') no-repeat;

其中dot.png是1x1大小的透明圖像。

來源

2012-07-30 12:21:25 idealmedia

好的，這個問題的解決方法是給錨點一個非透明的背景屬性。一些人建議給錨點透明的背景圖像。我有一個補充：圖像不一定存在。您可以簡單地寫任何路徑，它會使它工作：

a { 
    background:url('dummy/doesnotexist.png') no-repeat; 
}

來源

2013-03-14 09:45:11 Lukas

在IE9，Chrome和Firefox中，將背景顏色設置爲#FFF，不透明度爲0。不過不知道其他版本。將它設置爲透明不會幫助我。

這具有純CSS和跨瀏覽器的優點，所以也許它可能是更好的選擇。

來源

2015-05-11 19:42:28

問題與IE瀏覽器使用顯示器時：塊鏈接

回答

相關問題