html - div 内 float 过多

Question

所以我试图在一个 div 中运行 3 个 float ，但我遇到了这个问题。

http://jsfiddle.net/sPUjQ/101/ 点我

每当我运行两次 float 时，背景颜色会保持不变，但当我尝试运行 3 次 float 时，背景颜色就会消失!

有人能告诉我发生了什么事以及为什么会这样吗？我在做 inline-blocks 的时候没有遇到这个，只是 float: left。

Answer 1

当 float 子 div 时，父 div 会折叠，因为它们已从正常文档流中移除。在父级上添加 overflow:auto 以恢复您想要的行为:

.contain {
    display: block;
    background: blue;
    margin: 0 auto;
    overflow:auto;
}

jsFiddle example