如何"隐藏":白色空间的第一行:FIREFOX浏览器中的前置行

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(演示)

问题是你的html中有一个空行.因为你使用pre-line它也考虑到了这一点.

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

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

起初这看起来像一个Firefox bug(它的工作方式与Chrome,IE,Safari中的OP相同).
但阅读规范后,我发现它可以解释,因为它可以解释

用户代理可以" 重写 " 该段以包含:: first-line的虚构标记序列.这个虚构的标记序列有助于显示属性的继承方式.

如果UA遵循这种方法,那么不降低线的视觉高度是有效的,因为它仅适用于"虚构标签".(嵌套标签不能影响line-height其容器向下)

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