Div 100％高度不起作用

我想在頁面內部放置一個內容div，但我不知道爲什麼高度100％不適合body內的內容div？這裏是我的代碼示例：Div 100％高度不起作用

*{ margin:0;padding: 0;} 
html{height:100%; width:100%;} 
body{height:100%; width:100%;} 
#content{ position:relative; height:100%; width:65%; margin: 0 auto; background-color:#345C54;}

和HTML

<!DOCTYPE HTML> 
<html> 
<head> 
<link rel="stylesheet" type="text/css" href="style.css"> 
</head> 
<body> 
<div id="content"></div> 
</body> 
</html>

Here上的jsfiddle樣品鏈接。正如你可以看到內容div的高度不適合身體100％，請你讓我知道爲什麼會發生這種情況？

來源

2013-01-07 Behseini

你的意思是，爲什麼會出現滾動條？這是因爲填充。元素的總高度爲100％+ 50px填充。 – JJJ

嗨Juhana，感謝您的評論，但即使沒有這種情況發生。我刪除了填充屬性，但沒有改變！ – Behseini

不適合在其溢出或不適合，因爲它沒有達到預期的尺寸？ –

我改變填充爲0px（上jsfiidle鏈接），它似乎是正確的（垂直滾動條dissapeared）...

#page{ 
    position:relative; 
    height:100%; 
    width:65%; 
    margin: 0 auto; 
    background-color:#345C54; 
    padding-top: 0px; 
    }

這是你想要的嗎？

編輯： padding: 0px; //代替填充頂的

來源

2013-01-07 18:28:32 johnyTee

但它不適合我！底部仍有空間！ – Behseini

請參閱我的編輯，如果沒有幫助，您可以指定您使用的瀏覽器？ – johnyTee

Div 100％高度不起作用

回答

相關問題