隱形覆蓋DIV阻擋懸停？ +定位

我會說，我不是非常有經驗開始，所以我相信我的代碼是不是很「乾淨」 :-)隱形覆蓋DIV阻擋懸停？ +定位

我所說的網頁約在這裏可以查看：

CSS鏈接：

反正：我想建立它由幾個圖像按鈕，它改變UPO一個負責任的菜單徘徊。但是，我發現懸停/鏈接只會在懸停在按鈕的前30％時纔會發生。將鼠標懸停在低於該閾值的按鈕上，就會死機。

有一個媒體查詢來分隔兩行上的按鈕，一旦屏幕變得太小，但有趣的是，兩行仍然表現出相同的問題（而不僅僅是頂行的前30％工作，例如）。

從搜索類似的SO問題我懷疑與覆蓋div有衝突，但對於我的生活，我無法弄清楚問題出在哪裏。誰能幫我這個？

另一個問題可能很簡單，但我似乎無法弄清楚。正如我上面提到的，在較小的屏幕上，菜單更改爲兩行。我想將最下面一排靠近頂部，但我無法實現。我應該在這個元素中使用的定位的正確組合是什麼？

我希望我不要問太多！

它適合我在Firefox中正常工作，您使用哪種瀏覽器進行測試？ – Devin 2014-09-26 18:19:50

問題是因爲行高現在鏈接的高度爲0將行高增加到18px這會增加兩個導航行之間的空間，關於你的第二個問題你可以減小高度by 2px因爲margin-top：2px被賦予@ media中的#buttonsB（max-width：550px） – 2014-09-26 18:26:28

我試過Safari和Chrome，都是最新版本。但你是對的，我只是試過Firefox和問題似乎消失？奇怪的。 – 2014-09-26 18:28:38

你的圖片高度爲0px，這就是爲什麼懸停只能在圖片頂部工作（甚至不到30％）。你應該設置高度或更改你的行高屬性（對於例如20px設置爲非零值）

我又看了一眼，看到你的錨點浮起來了。嘗試清除你的花車。應工作太

2014-09-26 18:11:17 bkdir

非常感謝！事情是，按鈕沒有固定的高度，因爲它們在一定的寬度閾值之後變得更小以適應屏幕。我該如何處理？例如： – 2014-09-26 18:23:59

例如：button1_01.png文件的尺寸是119X15。通過使用CSS也可以提供相同的寬度和高度。你的寬度目前是百分比。不要使用最大寬度或百分比爲您的圖像 – bkdir 2014-09-26 18:31:16

非常感謝！最後，我能夠通過設置一個行高來解決問題，並使用底部行的負頂部邊距來縮小兩者之間的差距。很好！謝謝！ – 2014-09-27 00:11:06

地址：行高：12px的風格，你#buttons選擇在CSS文件：

#buttons 
{ 
    line-height: 12px; 
}

現在，他們正在設置爲0像素。改變它，它應該工作！

2014-09-26 18:32:35

感謝您的回答！ – 2014-09-27 00:10:00

回答