HTML Firefox上不顯示良好

這裏是不在Firefox（10）顯示良好的一塊HTML的HTML Firefox上不顯示良好

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Test</title> 
     <style> 
      * { margin: 0; padding: 0; } 
      .block6 { float: left; margin: 0 10px; width: 460px; } 
      .block { position: relative; } 
      .block:after { 
       clear: both; 
       content: ""; 
       display: block; 
       margin-bottom: 40px; 
      } 
      header { margin-bottom: 40px; } 
      .wie { text-align: center; } 
      .w { 
       margin: 0 auto; 
       padding: 0 10px; 
       text-align: left; 
       width: 960px; 
      } 
     </style> 
    </head> 
    <body> 
     <header> 
      <div class="wie"> 
       <div class="w"> 
        <div class="block"> 
         <div class="block6"> 
          aa 
         </div> 
         <div class="block6"> 
          bb 
         </div> 
        </div> <!-- block --> 
       </div> <!-- w --> 
      </div> <!-- wie --> 
     </header> 
    </body> 
</html>

的問題是，在頂部的「額外」的空間中顯示。如果我設置：

header { 
    margin-bottom: 0; 
}

額外的空間消失。我認爲錯誤出現在block或block6類中。任何建議？

在Chrome中顯示效果不錯。

編輯：

這裏是一個鏈接：http://jsfiddle.net/wARzA/

來源

2012-03-08 mneri

指向一個工作示例的鏈接可能會幫助您獲得響應。 – 2012-03-08 21:21:18

一種可以讓你在瀏覽器中獲得一致結果的方法是使用CSS重置，比如雅虎提供的重置（[YIU]（http://developer.yahoo.com/yui/reset/））或[埃裏克邁耶]（http://meyerweb.com/eric/tools/css/reset/）。這不會解決問題，並且有自己的一些小挑戰，但它將瀏覽器帶入了一個更加公平的CSS領域。 – 2012-03-08 21:32:24

這是一個奇怪的錯誤，但設置頂部邊框等許多事情會使該錯誤消失。也許最簡潔的方式是這樣的：

header { min-height: 1px; }

來源

2012-03-08 21:44:52

這有效！所以這是一個錯誤......我花了4個小時來削減尋找錯誤的頁面代碼。而...這是一個錯誤。：|非常非常感謝你！ – mneri 2012-03-08 21:48:04

我想問問是什麼原因造成的，但看起來雅各布解釋得很好......除非是紅鯡魚？ – stommepoes 2012-03-08 21:56:55

我在這裏提交了一個bug：https：//bugzilla.mozilla.org/show_bug.cgi？id = 734279。希望它會得到解決。 – Jacob 2012-03-09 00:15:38

這裏的問題。標題的底部邊距爲40px。裏面的內容都是浮動的，所以頭部永遠不會佔用任何高度。這就是爲什麼邊界出現在頂部的原因。

用填充替代邊距工作。 See this jsFiddle。

來源

2012-03-08 21:27:41 Jacob

感謝您的回覆。但看到這個http://jsfiddle.net/wARzA/內容**有一個高度**！ – mneri 2012-03-08 21:34:55

即使我在'

...

'的末尾加上了'

'，因此它不包含浮動元素，錯誤仍然存在。 – mneri 2012-03-08 21:39:26

HTML Firefox上不顯示良好

回答

相關問題