最小高度不適用於多個子div

我有一個網站，我使用高度自動設置內容div和最小高度100％的高度，以確保內容div總是延伸頁面的高度。最小高度不適用於多個子div

我的HTML看起來像這樣

<html> 
<body> 
<div id="holder"> 
    <div id="outercontent"> 
    <div id="innercontent"> 
    content goes here 
    </div> 
    </div> 
</div> 
</body> 
</html>

和我的CSS規則如下

html,body { 
    height:100%; 
    color:white; 
} 

#holder { 
    background-color:transparent; 
    width:100%; 
    min-height:100%; 
    height:auto; 
    position:absolute; 
    z-index:1; 
} 
#outercontent { 
    min-height:100%; 
    height:auto; 
    width:940px; 
    margin-left:auto; 
    margin-right:auto; 
    background-color:transparent; 
    background-image:url(../images/bowsides.png); 
    background-repeat:no-repeat; 
    overflow:hidden; 
} 
#innercontent { 
    width:900px; 
    height:auto; 
    min-height:100%; 
    margin-left:auto; 
    margin-right:auto; 
    background-color:#ffefce; 
    overflow:hidden; 
}

持有人的div是絕對定位的DIV，我需要這個，因爲我有一個旋轉的背景，看跌期權每個背景圖片放在一個單獨的絕對定位的div上所以這個div使用z-index放置在它們的頂部。

外的含量比我內心的內容更廣泛一點，這是用來給我空間放邊界圖像（因爲CSS3邊框圖像沒有被廣泛尚未支持）

內的內容是我的主要內容區域

min-height 100％適用於持有者div（即組的最外面的div），但它在任何瀏覽器的外部內容或內容上都不起作用

這是爲什麼？

來源

2012-11-22 Sam Coppock

是否有說最小高度的任何點：100％。爲什麼不說高度：100％？另外height：auto是默認值，所以需要設置它。爲什麼持有人的立場是：絕對？無論如何，如果你只是告訴所有的DIV是100％，它應該工作，我認爲。 –

該網站將以CMS爲動力，這意味着我無法保證內容所產生的高度爲屏幕高度的100％。所以我確實需要最小高度（或其他解決方案）才能工作。持有者的位置是絕對的，因此我可以使用z-index將內容顯示在背景的頂部。我需要這樣做，因爲該網站具有淡入/淡出效果的旋轉背景。每個背景圖像都有必要擁有自己的固定定位DIV，因爲DIV具有不透明屬性，而img標籤不具有。 –

你可以嘗試使用deleveloper工具打開IE中的來源，我想的東西是壓倒一切的高度，你會得到確切的圖片，然後

來源

2012-11-22 22:59:41

問題發生在所有的瀏覽器 - 不只是IE –

我明白，但這會給我們一個想法是什麼重寫它 –

最小高度不適用於多個子div

回答

相關問題