，Safari浏览器中的替代品

Question

＆amp; thinsp;，＆amp; ensp;，＆amp; emsp;在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上的页面显示了“固定宽度空间”的定义或典型宽度，例如THIN SPACE（它们并非都是固定宽度）。但是，从em单位（字体大小）的角度来看，最好从所需的间距量开始，然后忘记固定宽度的空格。

另一种可能性是使用普通的SPACE字符，但将其包裹在span中并设置其宽度。这需要使其成为内联块。当期望的非CSS回退是常规空间而不是没有任何间距时，该方法优于上述方法。请注意，搜索引擎应该假设CSS无知，所以这种方法与使它们“看到”字符之间的单词空间相关（例如，当你想要一个固定宽度的空间时，看看“foo bar”而不是“foo bar”单词“foo”和“bar”）。和往常一样，您可以使用NO-BREAK SPACE而不是SPACE来防止换行。

示例：

.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

我没有Apple设备，但我使用了几个跨浏览器测试网站来检查它。在Safari 9.1.3和Safari 7.1中，所有空格字符似乎都能正常工作。

Answer 3

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