省略号没有在Firefox中显示带有背景颜色的固定div

Question

这里评论不多......我试图将文本溢出设置为div上的省略号，同时在页面上的其他位置设置一个带有背景的固定div，这不是没有似乎在Firefox中工作（但与Chrome一起工作）...这是代码：

＆＃13;

＆＃13;

.fixed {
  position: fixed;
  background-color: #fff;
}

.ellipsis {
  width: 200px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

＆＃13;

<div class="fixed">
  asdf
</div>
<div class="ellipsis">
  Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

使用overflow: hidden和white-space: nowrap作为固定div。

检查代码段

.fixed {
  position: fixed;
  background-color: #fff;
  top: 50px;
  
  width: 120px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  
}

.ellipsis {
  width: 200px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

<div class="fixed">
  this is the demo text to rere
</div>
<div class="ellipsis">
  Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</div>