Webkit线夹将截断中间的链接

Question

我有一个链接

<div class="module line-clamp">
   <a href='some url' target="_self">some really long text</a>
</div>

和这个CSS

.module {
  width: 250px;
  overflow: hidden;
}
.line-clamp {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;  
}

我想在3行文字后截断此文字，并在其末尾加一个省略号

some
really
long ...

实际发生的是

some
really ...
text

如果我将html更改为

<div class="module line-clamp">
   <p>some really long text</p>
</div>

然后我得到

some
really
long ...

我想念什么？

这是一个JSFiddle。

Answer 1

希望这对将来遇到类似问题的人有所帮助。

这个简单的问题有一个简单的解决方案。我在锚文本周围放置了ap标签

<div class="module line-clamp">
   <a href='some url' target="_self"><p>some really long text</p></a>
</div>