When I try to center align text in Safari 6.1/7.0 and add word-spacing, the text is centered as if the space between words is not included in the width calculation.
For example, consider this CSS:
div {
width:300px;
border: 1px solid #CCC;
}
h1 {
text-align:center;
word-spacing: 90px;
}
And this HTML:
<div>
<h1>Text Text</h1>
</div>
This is how it looks in all other browsers: https://i.sstatic.net/IFW3H.png
But in Safari 7.0, it displays like this: https://i.sstatic.net/pMsKW.png
Here's a demo link: jsfiddle.net/2rwa3/2/
Is there a way to fix this issue without having to wrap each individual word with tags?