css - 子 div 100% 高度拉伸父 div

Question

我有一个非常简单的场景

父 Div（未指定高度）

子 div 有一些内容和高度设置为 100%。

现在这个子 div 强制它的父级拉伸到完整的浏览器窗口。

请指导。

Answer 1

在两者上设置位置。

#ParentDiv {
    position:relative;
    height:auto;
}

#ChildDiv {
    position:absolute;
    /* top/left/right force it to dimensions of parent, if needed */
    top:0;
    left:0;
    right:0;
    height:100%;
}

父母将伸展以适应孩子。

Answer 2

#ParentDiv {
    position:relative;
    height:auto;
}
#ChildDiv {
    position:absolute;
    /* top/left/right force it to dimensions of parent, if needed */
    top:0;
    left:0;
    right:0;
    height:100%;
}

您的 ParentDiv 高度是 AUTO ，因此孩子强制 Parent DIV 扩展到浏览器高度的 100%。从 Parenet DIV 中删除 auto。您的问题将得到解决。