Safari浏览器中的&thinsp；、&ensp；、&emsp；替代项

Question

 ， ， 在Safari浏览器中被破坏。

​

​

这些是薄空间，n大小的空间，m大小的空间，可以在其他浏览器中工作。

thinsp : a b c d e f g

ensp : a b c d e f g

emsp : a b c d e f g

在Safari中有没有替代这些的方法呢？

Answer 1

这可能是字体问题；为使用的固定宽度空格指定包含字形的字体可能会有所帮助。大多数字体都缺少它们。好的浏览器不需要字形，而是增加其他字符之间的间距。

但是，更可靠的方法是使用CSS技术添加间距，主要是padding属性，对于需要在所有字母之间添加特定间距的文本串，则使用letter-spacing属性。使用后者时，请注意它也会在最后一个字符之后添加空格。我在Unicode spaces上的页面显示了“固定宽度空间”的定义宽度或典型宽度，比如薄空间(并不是所有的空间都是固定宽度)。但是从所需间距的大小开始可能更好，就em单位(字体大小)而言，忘记固定宽度的空格。

另一种可能是使用正常的空格字符，但将其包装在span中并设置其宽度。这需要使其成为内联块。当所需的非CSS回退是规则的空格而不是缺少任何空格时，这种方法比上面的方法更好。请注意，搜索引擎应该被假设为不知道CSS，所以这种方法与使它们“看到”字符之间的空格相关(例如，当您希望“foo”和“bar”之间有固定宽度的空格时，可以看到“foo bar”而不是“foo bar”)。和往常一样，您可以使用不换行的空格来代替空格，以防止换行。

示例：

​

.thin {
  display: inline-block;
  width: 0.2em;
}

<div style="font-size: 200%">
<div>a b (normal space)</div>
<div>a&thinsp;b (thin space)</div>
<div><span style="padding-right: 0.2em">a</span>b (0.2em padding)</div>
<div><span style="letter-spacing: 0.2em">ab</span> (0.2em letter spacing)</div>
<div>a<span class=thin> </span>b (space set to 0.2em width)</div>
<div>a<span class=thin>&nbsp;</span>b (no-break space set to 0.2em width)</div>
</div>

​

Answer 2

这个问题似乎已经解决了。不管怎样，我不能复制它。我测试了四种常见的字体。下面是测试页面：

http://burtonsys.com/test_html_spaces.html

我没有苹果设备，但我使用了几个跨浏览器测试网站，用Safari对其进行了检查。在Safari9.1.3和Safari7.1中，所有的空格字符似乎都工作得很好。

Answer 3

我希望在表单中对齐框，并在span中使用&nbsp，在输入元素之前使用style="padding-left: 0.7em。然后，我使用0.4em、0.85em、0.95em和1.3em调整了每个em以对齐输入框，这些框都对齐在不需要任何调整的输入框上。