text-overflow:换行时第一行的省略号

Question

我有一个CSS的div:

div.c
{
font-size: 18px;
color: #888;
max-width: 300px;
display: inline-block;
overflow: hidden;
line-height: 20px;
text-overflow: ellipsis;
word-break: break-all;
}

The content in this div is "Abcdef abcdefabcdefabcdefabcdefaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa" //for example, given only to show length in div.

但如果使用上述CSS内容,div内容将被破坏,也没有three dots //as of text-overflow: ellipsis;.如果我删除word-break: break-all;那么将形成两行,第一行为第一行,第二行为第二行.但text-overflow: ellipsis;适用于此.

我该怎么做才能将所有文字保存在一行并进行text-overflow: ellpsis;工作？

谢谢!

Answer 1

white-space: nowrap; 我相信你需要什么.