文本溢出問題：省略號

Question

我遇到了文本溢出問題：省略號 - 它不想與我的網站一起工作。我目前正在學習，我有這個項目，我有div的文本與固定的高度。我嘗試了文本溢出：省略號，但我似乎無法使其工作。現在，我的代碼去如下：

<section class="comments"> 
    <p> 
     Here is a short comment. 
    </p> 

我的CSS是：

.comments p { 
    height: 40px; 
    text-align: justify; 
    text-overflow: ellipsis-word; 
    line-height: 20px; 
    word-wrap: break-word; 
    overflow: hidden; 
} 

它應該工作，但事實並非如此。我試圖用Firefox，Chrome，Opera和IE9來打開它，它並不適用於它們。我試圖在包含文本的<p>中添加樣式，但它沒有幫助。我試圖將<p>更改爲<div>，然後嘗試將樣式放到<div>但它不起作用。我嘗試使用文本溢出：僅省略號 - 它不起作用。我嘗試了文本溢出：剪輯 - 它沒有工作。很明顯，我在某個地方犯了一個錯誤，但我想這對我來說太明顯了。幫幫我！

Answer 1

http://www.quirksmode.org/css/contents.html說，「這個屬性只有在盒子有white-space: nowrap和overflow而不是visible時纔有意義。」請注意0​​不在CSS3 spec中。

此外，ellipsis-word似乎並未實施。這種風格適用於我（Win/Firefox和Chrome）：

.comments p { 
    height: 60px; 
    text-align: justify; 
    text-overflow: ellipsis; 
    line-height: 20px; 
    word-wrap: break-word; 
    white-space: nowrap; 
    overflow: hidden; 
    border: 1px solid #000000; 
}