text-overflow：省略号在chrome 61.0.3163.100中不起作用

Question

更新后无效。

CSS：

.outer {
    display:block;
    width: 100px;
    padding-top: 6px;
    font-size: 13px;
    color: #666;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.inner { display: inline-block }

//添加分号

<span class="outer">
    01
    <span class="inner">|</span>
    The first step.
</span>

这是实际代码。

Answer 1

＆＃13;

＆＃13;

.my-elm {
  display:block;    
  padding-top: 6px;
  font-size: 13px;
  color: #666; 
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 50px;
}

＆＃13;

<div class="my-elm">This is demo text.</div>

＆＃13;

＆＃13;

＆＃13;

Answer 2

检查其工作情况。您在display:block

之后遗漏了分号

＆＃13;

＆＃13;

div{

    display:block;
    width: 100px;
    padding-top: 6px;
    font-size: 13px;
    color: #666;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;

    }

＆＃13;

<div>afewfafwfawfawfawfawfawfawfawfawefawfawfawfawfawfawfwafawfawfawfwafawfwaf</div>

＆＃13;

＆＃13;

＆＃13;