我不知道为什么这个简单的CSS不能工作…
.app a { 高度:18 px; 宽度:140 px; 填充:0; 溢出:隐藏; 位置:相对; Margin: 0 5px 0 5px; text-align:中心; 文字修饰:没有; 文本溢出:省略; 空白:nowrap;} 颜色:# 000; ｝ < div class = "应用" > <a href="">Test Test Test Test Test Test Test</a> . < / div >
应该在第四次“测试”前后切断
当前回答
必须包含
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
绝对不能包含
display: inline
应该包含
position: sticky
其他回答
还要确保在IE10及以下版本中，换行设置为正常。
下面引用的标准将此属性的行为定义为依赖于“text-wrap”属性的设置。但是，wordWrap设置在Windows Internet Explorer中总是有效的，因为Internet Explorer不支持“文本自动换行”属性。
因此，在我的例子中，换行被设置为break-word(继承或默认?)，导致文本溢出在FF和Chrome中工作，但在IE中不工作。
关于换行属性的Ms信息
添加显示:块;或显示:inline-block;#User_Apps_Content .DLD_App
demo
你只需要添加一行css:
.app a {
display: inline-block;
}
把这些写在你的css规则中。
display: block; /* or in-line block according to your requirement */
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
必须包含
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
绝对不能包含
display: inline
应该包含
position: sticky
