css - 如何让子div扩展到父div

Question

您好，我在尝试让我的子 div 扩展到它所在的父 div 的高度时遇到了问题。

这是父div的css

#wrapper #content {
    border: 1px ridge #999;
    height: auto;
    min-height: 1000px;
    width: 1100px;
    margin-top: 40px;
    margin-right: auto;
    margin-bottom: 30px;
    margin-left: auto;
    float: left;
}

这是子div的css

.tab_container {
    clear: both;
    width: 100%;
    border-right: 1px ridge #999;
    margin-bottom: 20px;
    height: 100%;
}

有什么想法吗？

Answer 1

您可以使用以下样式来完成:(受此问题启发:CSS - Expand float child DIV height to parent's height)

#content {
    border: 1px ridge #999;
    height: auto;
    min-height: 1000px;
    width: 1100px;
    margin-top: 40px;
    margin-right: auto;
    margin-bottom: 30px;
    margin-left: auto;
    float: left;
    position: relative; /* added */
    width: 100%; /* added */
}

.tab_container {
    border: 1px ridge orange; /* added */
    clear: both;
    width: 100%;
    border-right: 1px ridge #999;
    margin-bottom: 20px;
    height: 100%;
    position: absolute; /* added */
}

Fiddle here