margin-top 失效 如何解决！

实例

失效1 

<div> 
      <div  class="box1"> float: left </div> 
      <div  class="box2"> clear:both; margin-top:20px; </div> 
</div>

解决 

 1.box2增加float属性

         2.box1与box2之间增加一层"<divstyle="clear:both;"></div>"

失效2

<div  class="box" style="height:100px;background:red;"> 
      <div  class="box2" style="clear:both; margin-top:20px; height:50px; width:500px;  background:#000;"</div> 
</div>

解决

    1.给父容器box加overflow:hidden;属性

    2.父容器box加border除none以外的属性

    3.用父容器box的padding-top代替margin-top