如何隐藏＆＃39; ：white-space的第一行：FIREFOX浏览器中的pre-line

Question

当我使用

时

white-space: pre-line;
word-break: break-word;

...在文字之前有一条加法线。为了隐藏它，我使用了：

.class:first-line { line-height: 0; }

...它可以在Chrome浏览器中使用，但不适用于Firefox。

这是一个工作小提琴，请在Firefox中打开：https://jsfiddle.net/t3qj51co/2/

Answer 1

为什么不修复HTML（demo）

问题是你的html中有一个空行。由于您使用pre-line，因此也需要考虑这一点。

只需删除空行即可修复它。

问题是firefox不允许比当前活动的line-height减少line-height。

起初这看起来像是一个Firefox错误（它的工作方式与Chrome，IE，Safari中的OP 相同）。 但阅读specification我发现它可以解释，因为它说明了

  

此段落可能由用户代理“重写”以包含 :: first-line 的虚构标记序列。这个虚构的标记序列有助于显示属性的继承方式。

如果UA遵循这种方法，那么不降低线的视觉高度是有效的，因为它仅适用于“虚构标签”。 （嵌套标记不能向下影响其容器的function textCounter2(field, counter, maxlimit) { if (field.value.length > maxlimit) field.value = field.value.substring(0, maxlimit); else document.getElementById('subtitlecount_lbl').innerText = maxlimit - field.value.length; } ）

所以不确定它是否是一个实际的错误（在任何一种浏览器上）或实现中的有效差异。