两个浮动元素＆＃39;保证金受邻近元素保证金的影响

Question

当我修改相邻导航栏的边距时，两个浮动图像的边距会发生变化。为什么这会发生？ http://jsfiddle.net/cuzox/waPr4/1/

*HTML*
<div>
    <div id="no1">Image</div>
    <div id="no2">Image</div>
    <div id="no3">Nav</div>
</div>

*CSS*
#no1{
width:100px;
height:100px;
float:left;
background-color:#A1A1A1;
}

#no2{
width:100px;
height:100px;
float:left;    
background-color:#B1B1B1;
}

#no3{
margin-top:30px;
}

Answer 1

在float:left;添加#no3之前，#no3元素不尊重其他两个元素，因此包含在容器的整个宽度中。将边距添加到#no3元素时，会导致另外两个元素受到影响。