html - 使用 float 时 Div 折叠

Question

<分区>

Answer 1

你必须“清除”你的花车。 float 元素将它们带出页面的正常 block 定位，因此向右浮动的元素会脱离父容器，折叠 div。你可以清除它们，或者更简洁巧妙的方法是在父容器中添加'overflow: auto':

#actions
{
    background: blue; overflow: auto;
}

#buttons
{
    float: left;
    overflow: hidden;
}

#text 
{
    float: right;
    overflow: hidden;
}

由于“overflow: auto”在某些情况下会产生滚动条，我通常通过在子元素上指定“overflow: hidden”来明确防止这种情况。根据我的经验，这很可靠。