與CSS

Question

防止垂直溢出我用這個代碼：

.truncated-filename { 
    max-width: 100px; 
    text-overflow: ellipsis; 
} 

要防止文件名被換向箱太長。但是，似乎存在垂直溢出問題。我怎樣才能做到這一點，只是把點放在最前面？

Answer 1

它看起來像你需要添加overflow: hidden和white-space: nowrap。

除非不換行，否則文本將不會被截斷，這就是爲什麼您需要white-space: nowrap和overflow值而不是visible。

.truncated-filename { 
 
    border: 1px solid; 
 
    display: inline-block; 
 
    max-width: 100px; 
 
    text-overflow: ellipsis; 
 
    white-space: nowrap; 
 
    overflow: hidden; 
 
}

<span class="truncated-filename">10128-teach-vector.png</span>