我之所以注意到标题是“双鱼汤的空白问题”。当您想用双破折号并排显示两个水平条时，取决于用于水平条的字符，会有间隙并且它们将不可见。一种解决方法是通过为 CSS letter-spacing 属性指定负值来缩小差距：
<p>――山路を登りながら、こう考えた。</p>
<p><span>――</span>山路を登りながら、こう考えた。</p>
<p><span>―</span>―山路を登りながら、こう考えた。</p>
span {
letter-spacing: -0.1em;
}
但是，如果像第二个p 元素一样，用span 标记将两个水平条括起来，下面的文本也会被拉到左边，字符之间的空间会很紧。因此，有必要通过将margin-right: 0.1em 添加到span 元素来纠正外观。
现在，第三个p 元素呢，只有左边的水平条被span 标签包围？在这里，只有破折号之间的空白被填充，而破折号后面的文本没有被绘制。这种方法看似简单又好用，但是...
不，等一下。 “对只包含一个字符的元素使用letter-spacing”......这是CSS规范吗？
规格CSS 文本模块 3 级的7.2. 跟踪：字母间距属性据此，例 23 有这样的解释：
示例 23
内联框应仅包含完全包含在该元素中的字符之间的字母间距，因此不包括元素右侧或后沿的字母间距：（谷歌翻译）
内联框应该只包含完全包含在元素中的字符之间的字符间距。所以，不包括元素右侧或后沿的字符间距.
我的意思是，这本来应该是这样的。
(1) 为
letter-spacing指定的值为仅用于字符之间的间距影响
（2）对只包含单个字符的元素应用letter-spacing不影响渲染结果（下图引用）
这些都与开头显示的“围绕水平条的
span元素”的实际呈现不一致。事实上，目前各大浏览器似乎都没有按照 CSS 规范来实现（1）和（2）。有趣的是，IE6 和 IE7 仅在span内部是正确的：
源代码：https://codepen.io/kaz_hashimoto/pen/eYMbeXO
这就是
span元素后面的文字也被“双大石”拉进来的现象。另外，如果您补充引用的推文的内容，日期为2002年2月13日（仍然开放）
错误 125390：CSS 字母间距样式在具有字母间距的元素的最后一个字母之后扩展
已注册，CSS 规范中未指定字母间距的行为。
当前格式的示例是WD 于 2013 年 10 月 10 日从和之前
西部数据 2007 年 3 月 6 日示例代码似乎首次发布在：
图中可以看到字母“f”后面的间距是[0]。参考：csswg-drafts/issues/1518
[css-text] 字母间距不应该应用于行/跨度的结束边缘吗？
原创声明：本文系作者授权爱码网发表，未经许可，不得转载;
原文地址：https://www.likecs.com/show-308624006.html