Firefox的text-overflow和inline-block实现是否错误？

Question

据我了解，文本溢出仅适用于内联元素：

此属性指定当内联内容在其块容器元素（“块”）的内联行进方向上溢出其线框边缘时发生的渲染，该块容器元素（而不是可见的）发生了溢出。

Firefox（在66.0.2 64位，macOS和其他可能的Gecko浏览器上进行了测试）然后不应该省略内联代码块，而且它的运行方式很怪异：它将整个内联代码块减少为“…” 。请参见下面的代码片段进行演示。

我在规格方面有什么遗漏吗，还是壁虎在这一点上错了？

我的问题涉及这些规格：

• 建议CSS基本用户界面模块级别3
• CSS溢出模块4级工作草案-在该特定主题上没有发现差异

.wrapper {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 400px;
  height: 40px;
  border: 1px solid lightgray;
  position: relative;
}

.wrapper div {
  display: inline-block;
  vertical-align: middle;
}

.wrapper img {
  vertical-align: middle;
}

.block {
  width: 40px;
  height: 40px;
  background: red;
}

<small>?? Case 0 : ellipsis, preceding inline-block and contained text in inline-block</small>
<div class="wrapper">
  <div class="block"></div>
  <div>I'm not concerned by ellipsis for now.</div>
</div>

<font color="firefox, damn">? Case 1 : ellipsis, preceding inline-block and overflowing text in inline-block</font>
<div class="wrapper">
  <div class="block"></div>
  <div>I'm a text so long I'll overflow for sure, cause there is no space for me in this world, I'm doomed and you know it well. Why would you even wrap me in a div? A div? Do you hate me?</div>
</div>

<small>? Case 2 : ellipsis, no preceding block and overflowing text in inline-block</small>
<div class="wrapper">
  <div>I'm a text so long I'll overflow for sure, cause there is no space for me in this world, I'm doomed and you know it well. Why would you even wrap me in a div? A div? Do you hate me?</div>
</div>


<small>? Case 3 : ellipsis, no preceding block and overflowing text in a span (inlined by default)</small>
<div class="wrapper">
  <img src="https://placekitten.com/40/40">
  <span>I'm a text so long I'll overflow for sure, cause there is no space for me in this world, I'm doomed and you know it well. Why would you even wrap me in a div? A div? Do you hate me?</span>
</div>

<small>? Case 4 : ellipsis, span all over the place and overflowing second text</small>
<div class="wrapper">
  <span>I'm a first text.</span>
  <span>I'm a text so long I'll overflow for sure, cause there is no space for me in this world, I'm doomed and you know it well. Why would you even wrap me in a div? A div? Do you hate me?</span>
</div>

Answer 1

Firefox 的行为看起来很完美，与 Chrome V75 相匹配，并且符合规范的这一段：

对于省略号值，实现必须根据需要隐藏行末端的字符和原子内联级元素以适合省略号，并将省略号紧邻剩余内联内容的末端边缘放置。一行上的第一个字符或原子内联级元素必须被剪裁而不是省略。

因此，包装器 div 的 div 子级是display:inline-block，这意味着它们是原子内联级框。当前面有 div 时，长文本不在第一个原子内联级元素中，因此可以省略它，并且该段落要求必须省略整个原子内联级框。