带有省略号和nowrap白色空格的textwrap

Question

我想使用ellipsis切断一些长文本。

但是，对于我当前的实现，它不包含会导致它超出div的额外单词，并且不会显示ellipsis以指示文本被截断。

我做错了什么？

http://jsfiddle.net/sw6Sp/6/

<div class="testWrap">This is some very long text that I want to cut off </div>

.testWrap{
    max-width: 125px;
    height:15px;
    overflow: hidden;
    text-overflow:ellipsis;
    border: 1px solid black;
}

Answer 1

只需使用text-overflow: ellipsis和white-space: nowrap。

Updated Example

.testWrap {
    width: 125px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

Answer 2

添加css-rule white-space: nowrap;可以解决您的问题。

<div class="testWrap" style="
    max-width: 125px;
    height:15px;
    overflow: hidden;
    text-overflow:ellipsis;
    border: 1px solid black;
    white-space: nowrap;
">This is some very long text that I want to cut off </div>