IE 7 CSS下拉菜單麻煩

我有一個下拉菜單，給我在IE7的問題。我浪費了整個早上試圖修復它。客戶正在使用IE7監控該站點，因此這是首要任務。IE 7 CSS下拉菜單麻煩

我已經設置了live demo和jsfiddle演示。 Here is the actual site我今天也在努力，僅供參考，但演示有孤立的問題。我留下了一些重置CSS等，以防其中任何相關。

有2個問題：

最重要的：有與頂部的菜單和IE7的頭內容z-index的問題。標題高於下拉菜單。
不太重要：第一個鏈接和下拉菜單之間的頂層菜單有一個小間隙，有時會導致從頂部鏈接移動鼠標時下拉消失。這至少會發生在Firefox 4和IE 7中。底部菜單中不會出現此問題。

我刪除了JavaScript，試圖消除任何clearfix CSS，消減下來的CSS和HTML，從HTML5切換到XHTML1嚴格，與位置和z-index的性能發揮，並在這裏讀了幾篇文章和其他有關z-index錯誤在IE中，但我仍然無法讓這一個預算。

我不在乎IE6支持，或者如果我必須使用JavaScript，我只需要讓它在IE7中爲客戶端工作。任何幫助是極大的讚賞。

來源

2011-05-05 Wesley Murch

如果有幫助，我已經解決了這些類型的問題多次：[見（HTTP：//計算器.com/search？tab = newest＆q = user％3a405015％20z-index），尤其是這些答案包含解釋（或指向它們的鏈接）：[1]（http://stackoverflow.com/questions/5615502/superfish-horizontal -nav-bar-not-getting-displayed-in-the-page/5615530＃5615530），[2]（http://stackoverflow.com/questions/5421813/why-is-my-css-drop-down-菜單打開隱藏-A-DIV功能於IE7/54 22364＃5422364），[3]（http://stackoverflow.com/questions/5154168/div-layering-problems/5154440#5154440）。 – thirtydot 2011-05-06 11:29:26

是的，這確實有助於@thirtydot，我結束了一個可怕的臨時JavaScript修復IE7中的其他元素，我會參考這些答案。我讀了幾篇有關z-index的文章，但是無法讓這篇文章工作，我從來沒有遇到任何問題，但我承認我通常只是在不知道自己在做什麼的情況下隨意亂轉z-索引值。謝謝。 – 2011-05-06 11:31:51

對於幫助我首先了解此問題的詳盡和精確的解釋：http://stackoverflow.com/questions/672228/ie-6-ie-7-z-index-problem/3998006#3998006 – thirtydot 2011-05-06 11:32:25

要的#header和#nav補充：

position:relative;

和

z-index:10 //for #nav 
z-index:0 //for #header

來源

2011-05-05 16:39:58

而已！我真的花了整整一天的時間，並在5分鐘內解決了它！當我完成這個項目時，我會對z-index做更多的閱讀，這對我來說太久了。 – 2011-05-05 16:44:17

對於第二個問題，我建議將「.nav> li> ul」元素用css移動2px。在UL中填充頂部可能會導致一些問題。 – 2011-05-05 16:50:10

我不明白的主要是設置z-index的元素，我和第二個nav和content body有類似的問題，但現在我可以自己弄清楚（希望）。第二個問題可能需要後臺處理，JavaScript正在現場處理它。儘管如此，我會給出一個鏡頭。 – 2011-05-05 17:00:31

IE 7 CSS下拉菜單麻煩

回答

相關問題