最小高度在最小高度 css答案

【问题标题】：min height in min height css最小高度在最小高度 css
【发布时间】：2012-10-24 15:41:23
【问题描述】：

我试图拥有一个最小高度为 100% 的 div 和另一个最小高度为 100% 的 div。

我不允许触摸标记，必须使用纯 css 完成。它也必须在 IE6+ 中工作，所以我不能使用 display:table。

我怎样才能做到这一点？

目前我有 html,body 设置为 height:100%, wrapper 设置为 min-height:100% 但是内部 div 需要外部 div 有一个高度设置才能有一个 % 设置本身...

这个问题的最佳解决方案是什么？

【问题讨论】：

我不明白你真正想要实现什么。请张贴标记（因为它是固定的并且必须用作使用的基础），以及您想要实现的目标的图像（最好清楚地标记 div 应该从哪里开始和结束）。
为什么不只是高度而不是最小高度？
@Sparky672 如果您只使用高度，则 div 不会像使用最小高度那样重排。调整我发布的 JS Fiddle 以查看此问题的实际效果。

标签： internet-explorer height css

【解决方案1】：

如果你需要支持 IE6，min-height 是不可能的。

您可以在其他浏览器中使用 min-height 并添加条件语句来设置高度，而不是在 IE 中设置 min-height。

IE8及以上支持最小高度。

对于支持 min-height 的浏览器，您实际上不需要嵌套 min-height 声明。您只需要外部元素的 min-height ，内部元素使用高度。

示例：http://jsfiddle.net/dmyN6/

body, html {
    height: 100%;   
}

.a {
    min-height: 100%;   
    background-color: blue;
}

.b {
    height: 100%;
    background-color: aqua;    
}

【讨论】：

好吧，我会在 IE6 的 CC 中使用高度而不是最小高度，所以这不会成为问题，我的问题是如果有办法让最小高度在最小高度内
我添加了一个例子——你不需要嵌套min-height。元素自动增长，只有外部元素使用min-height，内部元素使用height。
问题是，内部 div 现在可以拉伸更多内容，但不会填充没有内容的外部 div 请参阅我对 js fiddle 的编辑以了解我的意思，水色框应该与外一不顾内容jsfiddle.net/dmyN6/1
这对你有什么作用：jsfiddle.net/dmyN6/3 它已将最小高度切换到内部 div。
它与外部 div 重叠，但我想它不能以其他方式完成。谢谢