줄임표로 파이어 폭스의 배경색이 고정 된 div와 함께 표시되지 않습니다.

Question

여기에 언급 할 내용이 많지 않습니다 ... div의 줄임표에 텍스트 오버플로를 설정하려고합니다. 다른 곳의 배경으로 고정 된 div를 사용하고 있습니다. 고정 사업부에 대한

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