爲什麼我的頁面比<html>元素高？

我很害怕。在Internet Explorer和Mozilla Firefox中，此頁面非常高！我一直在使用jQuery來設置元素的高度幾乎與元素一樣高。它在Chrome中看起來很完美，但IE和FF渲染的頁面非常高。更值得一提的是，使用Firefox的檢查器時，我可以看到該頁面遠遠超出了元素的高度！爲什麼我的頁面比<html>元素高？

jQuery的：

(function($){ 
    var resize = function(){ 
     var height = $('html').height(); 
     $('#wrap > div').height(height-38); 
     $('html').height(height); // Added this to try and fix the height 
    }; 
    $(window).resize(resize).load(resize); 
})(jQuery);

的HTML佈局：

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="UTF-8" /> 
     <!-- ... ---> 
    </head> 
    <body> 
     <div id="wrap"><div> <!-- I want the child of #wrap to be the height of the entire page. --> 
     <div id="left"><div> 
      <!-- ... --> 
     </div></div> 
     <div id="main"> 
      <!-- ... --> 
      <div class="clear"></div> 
      <div id="body"> 
       <!-- ... --> 
      </div> 
     </div> 
     </div></div> 
    </body> 
</html>

的CSS：

html{height: 100%;} 
body{background: url('images/body.jpg') no-repeat fixed left top; border: 8px solid #BBB0A2; border-width: 8px 0 0 6px; min-width: 902px;} 
#wrap{max-width: 1130px;} 
#wrap > div{float: right;} 
#main{float: left; width: 630px; height: 100%; padding: 10px 20px 20px 20px; background: #FFFFFF;} 
#body{margin-top: 20px; font: 13px/18px Georgia, serif; color: #AE9073; position: relative;}

這裏的網站我想一起工作：http://www.phoenixarizonashutters.com/

T爲你提供幫助。

來源

2012-12-12 M Miller

是因爲你有填充嗎？我不是一個Web開發人員，但是主要佔用容器+填充100％的事實使它比容器更大？ – Colton

你有20px左右和10px頂部和20px底部填充... –

不知道這是什麼意思 - > _「設置元素的高度幾乎與元素一樣高。」_ – Sparky

您包含的代碼並不能說明問題，但如果我訪問您的網站，我可以看到這兩個元素：

<div style="height: 695px;">...</div> 
<div class="clear" style="height: 695px;"></div>

您的清算股利可能並不需要一個高度 - 刪除不管是什麼原因造成的，你的網站變得更合理。

來源

2012-12-12 19:15:47 KatieK

我在發佈問題幾小時後才發現這一點。感謝您注意！我給了內部包裝元素一個ID，而不是清除它。 –

我不確定我是否瞭解您的請求，但您的代碼有很多內聯樣式，這是一種不好的做法。

您有受着你的jQuery函數

$('#wrap > div').height(height-38)

爲了防止您的選擇從選擇.clear你可以使用一個div.clear：不是方法。

jQuery $('#wrap > div:not(".clear")').height(height-38)

來源

2012-12-12 19:01:36

爲什麼我的頁面比<html>元素高？

回答

相關問題