html - div 框在其他 div 下不对齐

Question

页脚 div 未在其他 div 下对齐，但看起来与内容 div 一样高。 (在内容和侧边栏 div 之间可见)

解决这个问题的方法是什么？ (问题是什么，我也想知道)

#container{
    width:1200px;
    margin:10px auto;
}

#content{
    width:65%;
    min-height:350px;
    margin:10px 10px 0 0;
    background-color:#f6904e;
    float:left;
}

#sidebar{
    width:410px;
    min-height:350px;
    margin:10px 0 0 0;
    background-color:#fddc68;
    float:right;
}


#footer{
    margin-top:10px;
    width:100%;
    height:20px;
    background-color:#de3643;
}

http://jsfiddle.net/HwM8M/

Answer 1

您需要清除 float 。

解释:http://css-tricks.com/the-how-and-why-of-clearing-floats/

另一个有用的链接:http://css-tricks.com/all-about-floats/

演示:http://jsfiddle.net/lotusgodkk/HwM8M/1/

HTML:

    <br class="clear" />

添加CSS:

.clear {
    clear:both;
}