具有<br>标记的多行省略号仅在IE11/Edge中的第一行添加省略号

Question

在Chrome和Firefox中，两行显示最后一个省略号。然而在IE11/Edge中，只有第一行有省略号，第二行是简单的截止。无论如何，让IE11/Edge的工作类似于Chrome/Firefox？

body { 
 
    font-family: 'Arial'; 
 
} 
 

 
div.wrapped-text { 
 
    overflow: hidden; 
 
    text-overflow: ellipsis; 
 
    white-space: nowrap; 
 
    width: 100px; 
 
}

<div class="wrapped-text"> 
 
This is a test of wrapped<br> 
 
text that should overflow 
 
</div>

Answer 1

对于相同的情况下任何人，我发现要得到这个工作的唯一方法是改变HTML一点，所以，在DIV每条线被包裹在自己的div - 以及那些子div获得css来添加省略号。

body { 
 
    font-family: 'Arial'; 
 
} 
 

 
div.wrapped-text { 
 
    width: 100px; 
 
} 
 
div.wrapped-text > div { 
 
    overflow: hidden; 
 
    text-overflow: ellipsis; 
 
    white-space: nowrap; 
 
}

<div class="wrapped-text"> 
 
    <div>This is a test of wrapped</div> 
 
    <div>text that should overflow</div> 
 
</div>