IE7中CSS菜單的奇怪的可見性問題

我有一個僅在CSS中使用的菜單（即沒有JS），它在所有現代瀏覽器中都很好用，但在IE7中有一個奇怪的錯誤。它在IE6中運行得不好，但我們不需要在這裏解決。問題如下：IE7中CSS菜單的奇怪的可見性問題

將鼠標懸停在菜單選項選項卡上時，會顯示下拉菜單。當您將鼠標移出該選項時，下拉菜單消失 - 僅在IE7中，該選項卡也會消失！獲取我的位置就是這個 - 如果您再次將鼠標懸停在其上，或者將鼠標懸停在任何其他選項卡上，該選項卡將重新出現。這怎麼可能？！鼠標懸停在另一個元素使原始標籤可見agin？令人討厭的是，它在這個網站的最後一個版本中起作用，並且在新設計中，它被破壞了。我試過比較，並且無法弄清楚它是什麼。

下面是當前破版小提琴：http://jsfiddle.net/pXZLJ/1/

這裏的老工作的一個之一：http://jsfiddle.net/43utK/

查看這些在IE7中看到的問題。幫幫我？謝謝:)

來源

2012-06-13 zenkaty

FYI它是在IE9上工作，更好地問沒有縮小的css –

是的，它也在IE8中工作。這個問題似乎只與IE7。對於縮小比較抱歉，我更願意以這種方式使用CSS，所以我所有的CSS都採用這種格式。 – zenkaty

@zenkaty，你可以改變樣式，還是想讓它們保持原樣但是讓它們在IE7中工作？我對這些風格做了一些改動，主要是簡化了它們，這些改動在IE7，FF和Chrome中都有效。這些樣式應該在IE6/7/8/9中工作（這裏是希望的。由於我沒有IE8/9，我不能在那裏測試它們）。 – sarcastyx

嘗試刪除您的CSS中的這一行：.nrmenu * {position:relative}。它似乎解決了一些問題。

編輯：正如sarcastyx指出的，它確實似乎影響下拉菜單。因此，請將position:relative添加到.nrmenu li，然後再次出現下拉菜單。

來源

2012-06-13 02:09:39 circey

當你移除'position：relative;'時會發生一件有趣的事情。沒有任何子菜單鏈接再顯示。 – sarcastyx

好點！如上所述修復。 – circey

工作，謝謝！這很奇怪，我發誓，這是我第一次嘗試 - 也許我試圖刷新並認爲它沒有工作時被緩存。謝謝:) – zenkaty

IE7中CSS菜單的奇怪的可見性問題

回答

相關問題