<style>

     .a {background:red; width:300px; height:300px;  }
     .b {background:green; position:relative; width:100px; height:20px; margin:10px;}
      .c {background:black; position:relative; width:100px; height:20px;}
</style>

<div class="a">
    <div class="b"></div>
    <div class="c"></div>
</div>

问题:.b { margin:10px;} margn-top:10px; 没有体现出来,效果却是margin-top:0;用firebug 看的话,我们可以看到margin-top:10px;是在的,但是效果却出现在最外层.a上面,所以一直有点困惑。

解决问题:

 <style>

.a {background:red; width:300px; height:300px; float:left; }
.b {background:green; position:relative; width:100px; height:20px; margin:10px;}
.c {background:black; position:relative; width:100px; height:20px;}

.clear{ clear:both;}
</style>

<div class="a">
    <div class="b"></div>
    <div class="c"></div>
</div>

posted on 2010-08-24 21:27  houbusheng123  阅读(322)  评论(0编辑  收藏  举报