具有<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>