最小高度不适用于多个子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

回答

相关问题