css：在Firefox 4中意外的邊距/填充css

我最近開始設置一個網站，並在Firefox 4中遇到了問題。我的主導航欄在頁面頂部有一個意外的邊距。 - 僅適用於Firefox 4. Chrome，IE8，IE9，IE7，Safari可以正常工作。只有FF4似乎錯誤周圍。我怎樣才能解決這個優雅沒有混亂與ff黑客我的CSS？css：在Firefox 4中意外的邊距/填充css

感謝您adive：

URL的現場演示：http://www.creativeworkx.at

來源

2011-05-13 Michael Creativeworkx

從#main-wrap DIV的2em保證金是導致它。

將margin-top: -2em添加到您的#doc修復程序中。

來源

2011-05-13 12:31:09

謝謝你，我太盲目了。但爲什麼只有FF？ – 2011-05-13 12:38:04

由於怪癖模式。提供適當的Doctype和FF將更加嚴格。 – 2011-05-13 12:39:04

爲什麼怪癖？這是正常的HTML 5標籤？ – 2011-05-13 12:40:20

這個CSS是BadGuy僅僅：

#main-wrap { 
    margin: 2em auto auto; 
}

來源

2011-05-13 12:31:40 jerone

謝謝你的幫助！ – 2011-05-13 12:42:31

我不明白。＃main-wrap不會環繞#top換行。＃main-wrap如何從頁面的頂部到＃頂部換行產生一個頁邊距？ – 2011-05-13 12:51:31

我已經制定了一個簡單的測試你的情況：

<div style="float:left;">test</div><div style="margin-top: 50px;"></div>

注：設置margin-bottom代替margin-top作用相似，但可通過將內容添加到第二個來解決DIV

它表明它是一種com激起float問題，導致意想不到的渲染。

這種意外的渲染甚至會出現在Firefox之外的瀏覽器中，例如Chrome。

但是，我最近發現了一個快速但並非正式的解決方案來解決您不可預測的有趣問題。

只需添加一個文本，不管是空白字符串還是 之後的菜單，第一個DIV或之前有空白的DIV。

您可以通過具有零高度和塊顯示屬性的元素來包裝文本。

像：

<div style="height:0">&nbsp;</div>

問題看起來像被這一招解決。 :-)

享受編寫CSS的樂趣。 :-)

來源

2011-05-13 14:33:37 tytsim

css：在Firefox 4中意外的邊距/填充css

回答

相關問題