Question

我有一个父#out和一个孩子#in div。父母是绝对定位的，它的最小高度是100％。它有效，但是如果我也给孩子设置了min-height：100％，那么就没有结果了。

HTML：

<div id="out"><div id="in">foo<br/>bar</div></div>

CSS：

#out {
    position: absolute;
    min-height: 100%;
    background-color: green;
    width: 100%;
}
#in {
    min-height: 100%;
    background-color: red;
}

仅适用于Opera JSfiddle链接：http://jsfiddle.net/TPyKS/

Answer 1

绝对定位元素不是与DOM中的其他元素一起计算的。它们被视为自己的浮动元素。其他元素的高度/宽度对他们来说毫无意义。因此，您无法根据它们设置基于最小高度/最小宽度的百分比。您需要明确设置高度/宽度。

Answer 2

将height: 100%;添加到#out

#out {
    position: absolute;
    min-height: 100%;
    background-color: green;
    width: 100%;
    height: 100%;
}

工作演示：http://jsfiddle.net/enve/TPyKS/1/

Answer 3

min-height :100% to height :100% on #out的更改将有效......

更新小提琴：http://jsfiddle.net/TPyKS/2/

CSS min-height不起作用

3 个答案: