带有文本对齐中心的 Safari 6.1/7.0 中的 CSS 字间距问题 [英] CSS word-spacing issue in Safari 6.1/7.0 with text-align center

问题描述

当我在 Safari 6.1/7.0 中对齐文本中心并添加字间距时，它使文本居中，就好像它的宽度不包括中心的空间一样.

例如CSS

div {宽度:300px；边框:1px 实心 #CCC；}h1{文字对齐:居中；字间距:90px；}

例如HTML

<h1>文本 文本</h1>

它在所有其他浏览器中的显示方式:http://i.imgur.com/JfdM2YG.png

它在 Safari 7.0 中的显示方式:http://i.imgur.com/OrhLa2Y.png

演示:jsfiddle.net/2rwa3/2/

是否有任何解决方法而不用标签包装单个单词?

解决方案

作为更新，这已被 Apple 确认为错误并合并到另一个未解决的错误中.目前不确定解决状态.

When I align text center in Safari 6.1/7.0 and add word-spacing, it centers the text as if its width did not include the space in the center.

E.g. CSS

div {
    width:300px;
    border: 1px solid #CCC;
}
h1 {
    text-align:center;
    word-spacing: 90px;
}

E.g. HTML

<div>
    <h1>Text Text</h1>
</div>

How it displays in all other browsers: http://i.imgur.com/JfdM2YG.png

How it displays in Safari 7.0: http://i.imgur.com/OrhLa2Y.png

A demo: jsfiddle.net/2rwa3/2/

Are there any workarounds for this without wrapping the individual words with tags?

解决方案

As an update, this was confirmed as a bug by Apple and merged into another open bug. Not sure on the resolution status at this time.

这篇关于带有文本对齐中心的 Safari 6.1/7.0 中的 CSS 字间距问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！