CSS嵌套div高度100％

我目前在頁面高度的100％獲得了#border div，但我試圖讓#container div在#border內部伸展到100％。此刻，#container只能延伸以適應其中的內容。CSS嵌套div高度100％

* { 
    margin: 0; 
} 

html, body { 
    height:100%; 
    font-family: Georgia, Times, "Times New Roman", serif; 
    font-size:13px; 
    line-height:19px; 
    color:#333333; 
    background: #f5f1ec; 
    text-align: left; 
} 

#border { 
    background: #f5f1ec; 
    border:solid 1px #FFFFFF; 
    width: 880px; 
    margin: 40px auto 0; 
    padding:10px; 
    height: auto !important; 
    min-height: 100%; 
    height: 100%; 
} 

#container { 
    background: #FFFFFF; 
    padding: 10px 50px 0; 
    height: 100%; 
}

來源

2010-05-28 Aaron Moodie

對不起你們，應在問題已經#container的，而不是＃內容。 – 2010-05-29 02:08:42

解決：

#container { 
    background: #FFFFFF; 
    padding: 10px 50px 0; 
    height: 100%; 
    width:780px; 
    position:absolute; 
}

來源

2010-05-28 06:56:48 Starx

謝謝Starx。剛剛完全剝離了我正在做的事情，這很好。也試圖在那裏找到一個頁腳，並在它之前停止邊界，所以可能不得不重新修改我的佈局。儘管感謝您的幫助。 – 2010-05-29 02:44:59

添加絕對位置確實會導致嵌套div填滿整個高度，但它也會導致它爲我填充的填充高度超過整個高度。任何想法爲什麼？我不希望滾動條在不需要它們的頁面上。 – 2010-10-26 15:52:38

這實際上是由於身體的邊距和填充可能會將它們設置爲「0」，如果問題出現，請嘗試在身體中設置「overflow：hidden」，它將解決此問題。 – Starx 2010-10-27 07:04:56

嘗試#container{min-height:inherit;position:absolute;}

，並添加overflow:hidden;到#border。

來源

2010-05-28 04:53:17 edl

是否意味着#container？ – 2010-05-28 05:27:39

對不起。您將#content放在頂部的說明中。 – edl 2010-05-28 05:40:13

嘿edl，我的意思是內容，因爲在內容（這是一個標準的兩列博客佈局） – 2010-05-29 02:06:24

CSS嵌套div高度100％

回答

相關問題