浮动:左突破容器div？

Question

我有一个模态框,我试图将两列彼此放在一起,我通过将float:left分配给一个div(.center-columnb)和一个float:right到.map-column来实现.然而,会发生'center-columnb'用灰色渐变背景打破容器div,好像这个div被放置在容器div下面(注意灰色部分底部的圆角边缘,这意味着在div的底部.当我从style.css中删除浮动:从centercolumnb离开时,一切都很好,除了右边的列不再停留在那里.有没有人有任何替代方案可以帮助我？谢谢:)

Answer 1

你有一个父div,#contentholder但此时它不包含浮动内容.默认情况下,浮动元素将从文档流中取出,任何父div都将折叠.要使其包含浮动内容,您需要为其提供溢出属性.这应该做的伎俩:

#contentholder {
    overflow: auto;
}

Answer 2

另一种方法是清除Question容器的底部.对于完全跨浏览器兼容的解决方案,只需在结束div之前添加:

<div style="clear:both"></div>