省略号在火狐中没有显示固定div与背景颜色

Question

这里没有太多的评论...我试图设置文本溢出省略号在一个div上，同时有一个固定的div与其他地方的背景页面，这似乎并没有在Firefox是工作（但与Chrome浏览器）......下面的代码：

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

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

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

Answer 1

使用overflow: hidden和white-space: nowrap为固定股利。

检查片段

.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>