IE9字母间距问题 [英] IE9 letter-spacing problem
问题描述
我有一个页面，确定，在FF（3x，4x），Chrome，IE（6，7，8）。
当在IE9上测试时，文本更宽。
调查这个问题看来，文本实际上是由其他字符更加分隔的字母。
当字母间距改为-0.6px时被渲染确定，类似于其他浏览器。
当将渲染模式更改为兼容性视图时，页面看起来很好。
你知道是什么导致渲染模式的改变？ / p>
我使用条件注释解决了问题，但我不太高兴。
<！ - [if IE 9]>
< style>
* {letter-spacing：-0.6px;}
< / style>
<！[endif] - >
是否存在其他方法来解决问题？
我在不同的电脑和不同的浏览器上制作了几张屏幕截图，结果可以看到这里
如你所见，在不同浏览器的不同机器上，结果是一样。唯一不同的是IE9在标准模式下。源页面是
<！DOCTYPE HTML PUBLIC - // W3C // DTD HTML 4.01 // ENhttp ：//www.w3.org/TR/html4/strict.dtd>
< html>
< head>
< meta http-equiv =content-typecontent =text / html; charset = utf-8>
< title>< / title>
< style type =text / css>
body {margin：0; padding：0;}
< / style>
< / head>
< body>
Lorem ipsum dolor sit amet，consectetuer adipiscing elit。 Nunc semper。
< / body>
< / html>
这可能与上舍入/下舍入有关。使用十分之一的px是一个奇怪的事情，因为你不能得到小于一个整个像素在屏幕上，除非你知道如何舍入会去。你不能依赖IE来获得任何东西。
I have a page that renders ok, in FF (3x, 4x), Chrome, IE (6, 7, 8).
When tested on IE9 the texts are wider. Investigating the problem it appears that the text is actually rendered whith letters more spaciated than in other borwsers.
When changed the letter spacing to -0.6px the texts was rendered ok, similar to other browsers. Also when changed the render mode to "Compatibility view", the page looks just fine.
Do you know what caused the change in the render mode?
I "solved" the issue using the conditional comment, but I'm not very happy about it
<!--[if IE 9]>
<style>
* {letter-spacing: -0.6px;}
</style>
<![endif]-->
Does any other methods exists to solve the problem?
Edit
I made a few screenshots on different machines and different browsers and the result can be seen here
As you can see, on different machines with different browsers the result is the same. The only one that renders differently is IE9 in standard mode. the source page is
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title></title>
<style type="text/css">
body {margin:0;padding:0;}
</style>
</head>
<body>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc semper.
</body>
</html>
It may have to do with rounding up/down. Using tenths of a px is a strange thing to do since you can't get less than a whole pixel on a screen unless you know how the rounding will go. You can't rely on IE to get anything right anyway.
这篇关于IE9字母间距问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
