html - -webkit-line-clamp 在 Chrome 上不起作用，除非我在开​​发人员工具中进行了一些不相关的 CSS 更改

Question

我想在 Chrome 中的一定行数后添加省略号。正如各种论坛中所建议的，我使用了如下的 webkit-line-clamp 策略

.line-clamp {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;  
   text-overflow: ellipsis;
   overflow: hidden;
}

所以我没有看到第四行末尾的省略号，但是如果我进入开发人员工具并对元素中的 CSS 进行一些随机更改(比如更改元素的边距，或者选中并取消选中上述属性之一)，然后会看到省略号。这类似于 https://bugs.chromium.org/p/chromium/issues/detail?id=265836 中报告的内容.

这个问题有解决办法吗？我无法在纯 html 中重现此问题，它似乎只发生在应用程序中，原因不明。

Answer 1

根据 Andyweb 的评论，解决方案发布在 css - multi line line-clamp (ellipsis) doesn't work对我有用。