谷歌瀏覽器與z-index斷開鏈接：-1

所以最近我遇到了一個Chrome瀏覽器的問題，其中如果我將-1的z-index設置爲position: relative;無序列表，則鏈接變得無法點擊。谷歌瀏覽器與z-index斷開鏈接：-1

查看http://jsfiddle.net/raLnx/以Chrome 20.0.1132.47m爲例。

有沒有問題，如果兩個ul部分都給予了積極的z-index，但我想這是無論是在瀏覽器的錯誤或多個設置存在一些position: relative;時，我並不需要一個更好的辦法。

有問題的CSS：

ul.over { 
    height: 40px; 
    line-height: 40px; 
    border-radius: 5px; 
    background-color: #DDD; 
    border-bottom: 2px solid #AAA; 
} 

ul.under { 
    height: 35px; 
    padding: 0 30px; 
    background-color: #EEE; 
    line-height: 35px; 
    font-size: 90%; 
    position: relative; 
    bottom: 5px; 
    z-index: -1; 
}

任何想法？

來源

2012-07-04 Samuel Parkinson

這不是一個谷歌鉻特定的，也發生在Firefox上...... – silentw

我想建議這是一個錯誤還是這個預期的行爲，因爲基本上你設置的鏈接出現在所有其他層下面 –

@沉默是否firefox 3d顯示器將任何光線都轉移到鏈接出現在相對於身體的位置？ –

它發生的原因是因爲您的div #nav現在位於您的列表/鏈接之上。您將不得不從列表中刪除z-index。

來源

2012-07-04 13:55:12

你能提供一個關於jsfiddle的例子嗎？我通過編輯#nav試過的東西不起作用。 –

這裏http://jsfiddle.net/raLnx/14/ –

是的，這是我開始。但不幸的是，它隱藏了我試圖用z-index顯示的底部邊界。 –

谷歌瀏覽器與z-index斷開鏈接：-1

回答

相關問題