margin与padding在不同版本的IE的表现

html:

 

<div id="test1">

              <img src="01.jpg"/>

</div>

css:

div#test1{

       width:210px;

       height:150px;

       background:#5cb3f0;

}

div#test1 img{

       display:block;

       width:200px;

       height:136px;

       margin:0px;

       padding:0px;

}

 

margin:

    margin:0px

        没有撑开,在IE6，IE7和IE8中，如图：

 

      

 

    margin:15px   

        IE6和IE7出现了不同的情况,在IE6中，如图：

    

    在IE7和IE8中，如图： 

    

 

padding：

     这时margin都设置为margin:0;

    padding:2px

        没有撑开，IE6，IE7，IE8显示的都一样：

   

 

    padding:15px

        IE6把容器撑开了：

   

    而在IE7和IE8中，如图：

   

 

    所以，使用margin或者padding时，如果子容器的尺寸加上内外补丁的总尺寸大于父容器的尺寸时，IE6中就会撑开父容器，从而影响到网页的这整体布局。