问题描述
|
使用ѭ0似乎确实与ѭ1搞砸了：http://jsfiddle.net/NFAzv/
谷歌搜索还没有发现任何东西。我在这里想念什么吗？
编辑＃1：这就是我要得到的（在Vista上为Firefox 3.6.8和Chrome 12.0.742.91）：由于新手的链接限制而删除了链接（可以在评论中找到）（请注意中心根本不排队）
编辑＃2：这是IE9，带有居中的垂直线以显示问题所在：http：//i.stack.imgur.com/C0J0n.png
编辑＃3：我在下面的评论中确认，该问题出现在Windows 7上的Chrome 10上。至少我不是唯一一个发疯的人。
解决方法
似乎所有浏览器都已收敛于一个字母间距的实现，这与css3所说的应该发生的事情显然不符。
特别是请参见示例XV，网址为http://dev.w3.org/csswg/css3-text/#letter-spacing0
浏览器根本不这样做。 IE甚至最近改变了其行为（我认为是IE9），使其更类似于其他浏览器，而不再像当前编写的CSS3规范那样。
有问题的CSS3规范仍处于起草阶段，因此大概在某些时候会进行更改以匹配浏览器的功能。
您可以通过添加左填充值以匹配字母间距来重新平衡行，但这并非总是可能的。
, 由于问题并未得到真正的描述，因此我认为文本的居中位置不是很好。
您可以使用ѭ2来缩小字母间距的一半大小。
.centered {
letter-spacing:12px;
text-indent:6px;
}
letter-spacing
<div style=\"text-align: center;\">
<div style=\"font-size: 130%; letter-spacing: 0.6em; padding-left: 0.6em;\">THIS</div>
<div style=\"font-size: 350%; letter-spacing: 0.4em; padding-left: 0.4em;\">ILLUSTRATES</div>
<div style=\"font-size: 130%; letter-spacing: 0.4em; padding-left: 0.4em;\">THE</div>
<div style=\"font-size: 200%; letter-spacing: 0.1em; padding-left: 0.1em;\">PROBLEM</div>
</div>
...
<div style=\"font-size: 350%; letter-spacing: 0.4em;\">
ILLUSTRATE<span style=\"letter-spacing:0;\">S</span>
</div>
...
<div style=\"text-align: center;\">
<div style=\"font-size: 130%; letter-spacing: 0.6em;text-indent:0.3em\">THIS</div>
<div style=\"font-size: 350%; letter-spacing: 0.4em;text-indent:0.2em\">ILLUSTRATES</div>
<div style=\"font-size: 130%; letter-spacing: 0.4em;text-indent:0.2em\">THE</div>
<div style=\"font-size: 200%; letter-spacing: 0.1em;text-indent:0.05em\">PROBLEM</div>
</div>