Question

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

<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

text-wrap：none和text-overflow：椭圆都被忽略

1 个答案: