css省略號不起作用

我用下面的css表示省略號，但點不會出現任何人都可以告訴我在我的css中有什麼問題。css省略號不起作用

由於提前

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

來源

2016-04-22 Prameshwar Kumar

文本溢出不會垂直工作，可以說是你的問題？ –

你的代碼沒有錯。我認爲課堂呼叫是錯誤的。 – krishna

請試試這個... 您需要一提的固定寬度的文本容器，因此，如果文本超過了寬度，然後... ...將apear：

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

來源

2016-04-22 08:02:26 satya

更改CSS：

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

來源

2016-04-22 08:03:32 Dilip

如果你的HTML是這樣那麼CSS規則正在

<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/

來源

2016-04-22 08:03:44 krishna

你的代碼是好的，嘗試在這個FIDDLE

的問題是你有一個錯字.message-suject，並在你的HTML apperently是.message-subject與b像它應該是

來源

2016-04-22 08:04:12 Chris

css省略號不起作用

回答

相關問題