我有一個小問題。每當我將鼠標懸停在「搜索引擎優化」選項,我在IE導航,導航打破&移動到側面。這在Firefox中不會發生。將導航更改爲位置:絕對修復它,但隨後主要內容將與導航合併。全部驗證。任何幫助將非常感激!導航懸停打破了IE
http://jsfiddle.net/eoJ1/Ra4tR/
由於負荷!
我有一個小問題。每當我將鼠標懸停在「搜索引擎優化」選項,我在IE導航,導航打破&移動到側面。這在Firefox中不會發生。將導航更改爲位置:絕對修復它,但隨後主要內容將與導航合併。全部驗證。任何幫助將非常感激!導航懸停打破了IE
http://jsfiddle.net/eoJ1/Ra4tR/
由於負荷!
navleft
和navright
div獨立調整大小,這是根據您的設計結構預期的。但它看起來奇怪,因爲它歸結於以下內容的頂部:
一個建議,我可以給你是不是來設置%的導航欄的寬度,你已經爲這兩個div的完成。如果設置一個固定的寬度(以像素)或完全除去寬度規範(在這種情況下,這將需要在其內的內容的寬度),水平滾動條將出現在網頁下面當寬度小,這我想是細。此外,由於他們打破的文檔中的內容的流量和更容易打破布局中使用盡可能少的float
S作爲可能的。這兩個div都有一個float:left
,可以傾倒更穩定的解決方案。我說這一切是因爲我認爲由於這些原因,懸停佈局的破壞正在發生。如果你能照顧到這一點,你的問題可能會消失。
所以我的建議是有一個nav
div與width: 100%
。在這裏面有兩個div:navleft
和navright
與display:inline
和寬度a。)在px中指定或根本沒有,或b。)以%指定,但在px中有一些min-width
。如果您沒有指定任何寬度爲navright
,它將展開以填充右側的所有空間。
這樣這兩個div不會獨立迴流。
基本上,玩玩具更多,直到你得到更好的CSS命令;我認爲更多的經驗會自動幫助你理清這樣的問題。
你可以將你的代碼縮減到相關的部分,而不是整個頁面?使其更易於調試。 – 2012-02-25 14:57:46
完成:) http://jsfiddle.net/eoJ1/u35mS/ – Joe 2012-02-25 15:15:11
首先,在Chrome上您網站上的藍色背景中的鏈接沒有顯示下面的行上懸停。但是,他們在jsfiddle示例中顯示。 – 2012-02-25 15:21:32