css - 文本换行 : none and text-overflow:ellipses both being ignored

Question

如果我的文本太大而无法放在一行中，我希望我的文本被截断，但是即使我添加了 text-wrap:none 和 text-overflow:ellipses 它会溢出到多行而不被截断.

<snip>

<ul>
<li>
<img = ...>
<div id = "track_title">text</div>
</li>
</ul>

ul {
    position:absolute:
    list-style: none;
    top:20px;
    margin: 0px;
    padding: 0px;
}

li {
    position: relative;
    background-image: url("track_row_unselected.png");
    display: block;
    height: 80px;
}
#track_title {
    position:absolute;
    padding:0;
    margin:0;
    top: 5px;   
    left: 80px;
    width: 180px;
    font-size: 15px;
    font-weight: bold;
    text-wrap:none;
    text-overflow: ellipsis;
}

Answer 1

text-wrap任何主流浏览器都不支持。尝试使用 white-space: nowrap;。您还需要添加 overflow: hidden;。 Here is a jsFiddle .