html - 如何使 float div 容器适合 div 高度？

Question

我有一个 div 容器 #parent和一个 div child #child谁是父 div 的 child 。
#child div 包含文本，他向左 float ，问题是我想要 #parent div 以适应 #child` div 的高度，无论高度是多少，同时保持 float 属性。

    #parent{
       background: red;
       height: auto;
    }

    #child{
       float:left;
    }

    <div id='parent'>
        <div id='child'>
           <p>Some text Some text Some text</p>
        </div>  
    
    </div>

这是一个 Jsfiddle

Answer 1

添加 overflow:auto给家长:

#parent {
    background: red;
    height: auto;
    overflow:auto;
}
#child {
    float:left;
}

jsFiddle example
当您 float child 时， parent 会折叠，因为它表现得好像 child 不占用空间。添加溢出规则可恢复您所追求的行为。