IE6里调整空白DIV的高度为0问题

 

<div>
   <div style="width: 45%; float: left;">
   	<img src="/singulart/displayChart?filename=jfreechart-13003.png"/>
  </div>
  <div style="width: 5%; float: left; font-size: 0pt;"/><!--这里是设置间隙的空白DIV-->
   <div style="width: 48%; float: right;">
	<div class="reportchart_title">
日平均熱量消耗分佈圖
		<br/>
		<span> (2009-12-25 ~ 2009-12-31) </span>
	</div>
        <img src="/singulart/displayChart?filename=jfreechart-13005.png"/>
    </div>
     <div class="clearboth"/>
</div>

 

 

下面的代码，是为了将两个图片所在的DIV中间间隔一点间隙，在FireFox下只需写一个空的<div style="width:5%;height:0px;"></div>

就OK，在IE7+都是没问题的，但是，在IE6里面，却总觉得左边的图片稍高2px，右侧的图片稍低，后来用将DIV的borer调出来查看，看出问题的本质了，原因是在IE6里面，即使设置height为0也是没用的，它仍然显示成一个具有高度的框框，怎么将高度设置为0呢？

找了很久，原来竟然需要<div style="width: 5%; float: left; font-size: 0pt;"/>这样设置，需要设置font-size为0 才可以让高度为0，即使内容是空的。

 

评论

1 楼 kuchaguangjie 2010-05-17  

不错