css省略記号が機能しません

Question

私は省略記号には以下のCSSを使用しましたが、ドットが来ないのは誰でも私のCSSに何か間違っていると言えるでしょうか？

アドバンス

.inbox-message-list li .message-suject{ 
    white-space: nowrap; 
    width: 100%; 
    overflow:hidden !important; 
    text-overflow: ellipsis !important; 
    display:block; 
} 

Answer 1

のおかげでこれを試してみてください...あなたはテキストが、その幅を超える場合...つくれますように、テキストコンテナの固定幅を言及する必要があり ：

HTML：

<ul class="inbox-message-list"> 
<li class="message-suject"> 
    This is some long text that will not fit in the box 

</li> 
</ul> 

CSS：

.inbox-message-list li.message-suject 
{ 
    white-space: nowrap; 
    width:150px; 
    overflow:hidden !important; 
    text-overflow: ellipsis !important; 
    display:block; 
} 

FIDDLE

Answer 2

変更CSS：あなたのHTMLは、この後、CSSルールのようなものである場合

.inbox-message-list li.message-suject 
{ 
white-space: nowrap; 
width:150px; 
overflow:hidden !important; 
text-overflow: ellipsis !important; 
display:block; 
} 

Answer 3

あなたのコードは大丈夫です

<ul class="inbox-message-list"> 
    <li> 
    <div class="message-suject"> 
sdjkfhjksd fsjkfhskdhf ksdhfksdj fksdahfsdka fhsdkajf sdakfhksd afhsdk fksdhfksd fgsdk fksdhfksdhfkjshdf kshdfksd fkshad fksdhfkshdfkhsadkfhskdhfdsfsd 
    </div> 
    </li> 
</ul> 

https://jsfiddle.net/z1aey05k/

Answer 4

が、この中でそれをしようと取り組んでいますFIDDLE

問題は、