html - clear：两者都不会阻止包装

Question

我有 3 个 div：其中 2 个是浮动的（向左和向右），第 3 个应该放在另外两个下面。我曾经clear: both这样做，但它根本不起作用！

http://jsfiddle.net/uYrPY/1/

CSS

.left, .right {
    width: 50px;
    height: 100px;
    background-color: red;
}
.left {float: left;}
.right {float: right;}
.bottom {
    background-color: blue;
    width: 100px;
    height: 100px;
    clear: both;
}

HTML

<div class="left">
</div>
<div class="right">
</div>
<div class="bottom">
</div>

在此先感谢您的帮助！

Answer 1

您的jsfiddle中的“clear:”和“both”之间有一个不间断的空格，将其删除，它将正常工作！

http://jsfiddle.net/uYrPY/2/

 .left, .right {
    width: 50px;
    height: 100px;
    background-color: red;
}
.left {float: left;}
.right {float: right;}
.bottom {
    background-color: blue;
    width: 100px;
    height: 100px;
    clear: both;
}