在IE中将文本截断为3行

Question

我有一个简单的span标签，内容跨越多行，我已经弄清楚如何在3行上限，然后跟进省略号（...）

问题是，它在IE11中不起作用，我想。这是我的代码：

HTML：

<span class="itemLabel">
     This is Line 1<br/>
     This is Line 2<br/>
     This is Line 3<br/>
     this is Line 4<br/>
     this is Line 5<br/>
</span>

CSS：

.itemLabel{
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    font-size: 11px;
}

现在跨度的内容是动态填充的，所以我对放入跨度的文本量进行ZERO控制，并且我们在围绕此跨度的锚标记上设置了180px的宽度和产品图像，所以我不能简单地“不要使用尽可能多的断点标签”，我将它们放在那里作为一个例子，即使存在5条线，CSS也会将跨度切断为最大值。

如何在IE中实现相同的显示？

Answer 1

由于没有跨浏览器解决方案，我需要某种方式来限制用户友好设计中的文本输出。后端[数据库]导出三（3）个不同的可能信息，标题，作者，价格（问题是标题和/或作者将运行到多行）。

我得到的解决方案是简单地将这三条信息分成三个不同的跨度，并将自动换行/省略号的跨浏览器解决方案应用于每一行。我向客户介绍了这个，解释了这些限制，他们对这个解决方案没问题。

似乎越来越多的IE / Edge在UI / UX和响应式设计方面的新进展越来越不可靠。我们的最后一项检查是，只有3％的客户仍然使用IE / Edge作为他们选择的浏览器。