IE 字体 bug

症状参见网页中英文混排行高不等问题的解决方案探讨，不过不太认同最后的观点。

做了个简单的demo

<ul class="clearfix">
	<li>QQ</li>
	<li>QQ农场</li>
	<li>腾讯朋友</li>
</ul>
yui reset
body{font-size:12px;font-family:Tahoma}
li{float:left;_display:inline;}

IE7（IE9的IE7模式）中显示如下：


很明显没有对齐

按F12用开发工具分别看3个li的盒模型



可见高度不一致，换了其他几种字体如Arail, Verdana等高度略有不同，不过高度依然不一致，但这并不是对不齐的原因

为li加上除normal外的line-height后盒模型的高度一致了，但视觉上依旧对不齐

不怎么爽的解决方法：字体设为中文字体，如宋体

li{#font-family:宋体}

另在英文字体情况下，切换为IE8、IE9模式也存在3个li高度不同的情况，只不过从视觉上看不太出来而已

Tags:

This entry was posted on 星期三, 三月 30th, 2011 at 21:43 and is filed under 未分类. You can follow any comments to this entry through the RSS 2.0 feed. You can leave a comment, or trackback from your own site.

4 comments

  1. heluyao 说道：
    2011/04/02 10:24

    可能这就是个大门户的字体都使用宋体的一个原因吧~我只是猜测！
    宋体的英文虽然比不上其他tahoma或者arial、Verdana好看，但是各浏览器下的表现基本一致，而且行高统一。tahoma在ie6下的下划线的确是难看了点，arial的偏差是相对较小的，拙见。

    回复
  2. 见天 说道：
    2011/04/06 17:18

    我记得看过一个腾讯的ppt 不是说 腾讯的字体都有严格的要求么?

    回复

Trackbacks/Pingbacks

  1. 全局字体调整 « 99css 说道：
    2011/04/14 11:32

    [...] 在最初看网页中英文混排行高不等问题的解决方案探讨（也就是神奇的1.231，我个人的建议）的时候曾去找过1.231的由来 Default Text [...]

    回复

Leave a comment