ie6下标签定义的高失效，显示的高不受设定的height值影响

今天又碰到一个奇葩的ie6兼容bug，忍不住抱怨下这个后妈生的鬼东西！！

看图这个是在非ie6下的浏览器效果

这个是在ie6下的显示效果

 

 看的出问题所在吧，上html代码，看一下布局吧

<div class="c fl">
     <h1><i></i>活动介绍</h1>
        <p>气候变化是指气候平均状态随时间的变化，即气候平均状态和离差（距平）两者中的一个或两个一起出现了统计意义上的显著变化。离差值越大，表明气候变化的幅度越大，气候状态越不稳定。统计意义上的显著变化。离差值越大，表明气候变化的幅度越大，气候状态越不稳定。大，表明气候变化的幅度越大，气候状态越不稳定。
        <a href="http://www.cnblogs.com/liujinyu/p/3569249.html" title="">刘金宇</a>
     </p>
</div>

用的<i>标签做的色块，定义的width 和height 都是20px，但是在<h1>下，<i>的高度受其父元素的影响，永远直达底部，与<h1>看起，所以如果你给<i>定义的高度比<h1>高，就能生效并把<h1>撑开，但是设置的<i>高度要是比<h1>小，那设置值就失效，实际高与<h1>看起，奶奶的，逼我爆粗口。

现在：本文的高潮来了啊，那就是公布我尝试出的解决办法，那就是

给<i>加一个属性：   font-size:0;

虽然ie6是后妈生的，干爹养的，但是也敌不过人民群众的伟大智慧，对于一个问题总会有多种解决办法，也许我这个方法不是最优，还有更好的方法，但是也先记下来吧，自己看看，也给同僚们提个醒。

支持原创：附上转自http://www.cnblogs.com/liujinyu/p/3569249.html