Div清除浮点值,即使未设置清除属性

这是一个太基本的问题,但我网站上div的行为让我感到困惑。

我以前也遇到过同样的问题,所以我确信我一直在做一些错误的事情,或者误解了一些基本的CSS规则。

问题: 为什么站点右下角附近的红色div标记会清除其左侧对应的标记?没有“明确”的规则适用于它!

这是html:

<div id="home-left">
<?php 
echo "Some php=generated content";
?>
</div> <!-- END HOME-LEFT -->

<div id="home-right-container">
<p>Blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah</p>
</div> <!-- END HOME-RIGHT-CONTAINER -->

下面是相应的CSS:

#home-left {
width:280px;
margin:0 0 0 20px;
//clear:both; /* STAY CLEAR OF THE SCROLLER-FEATHER-CONTAINER! */
}

#home-left h3 {

    //font-size: 1.128571429rem;
font-size:12px;
    line-height: 1.2;
    font-weight: bold;
text-transform:uppercase;
margin-bottom:10px;
}

#home-left p {
    margin: 0 0 24px;
    margin: 0 0 1.514285714rem;
font-size:11px;
    line-height: 1.5;
}

#home-right-container {
width:100px;
background:red;
float:right;
}