CSS 중지 텍스트 오버플로

Question

동적 응용 프로그램을 작성 중입니다. 한 가지 문제는 div 안에 텍스트가 포함되어 있고 div 크기가 너무 커서 텍스트를 포함 할 수 없을 때 브라우저가 재미 있다고 생각하는 것입니다.

어쨌든 CSS에서 'cutoff'텍스트를 만들 수 있습니까? 적합하지 않은 텍스트는 제거됩니다.

Answer 1

사용 overflow: hidden

Answer 2

당신은 overflow: hidden;를 시도?

Answer 3

불행히도 부분적으로 렌더링 된 텍스트를 보지 않고서도이 문제에 대한 완전한 CSS 해결책은 없습니다. 가장 가까운 것은 CSS3 속성 text-overflow: ellipsis을 사용하는 것입니다. 그러면 문자열을 클립하고 '& hellip;'을 추가합니다. 끝까지. 이 기술의 가장 큰 단점은 Firefox가 현재이를 지원하지 않으며 가까운 장래에 Firefox처럼 보이지 않는다는 것입니다. 그러나, 당분간 당신이 사용할 수있는 덜 우아하고 덜 우호적 인 solution for Firefox가 있습니다.

기타 정보 :
W3C text-overflow specs (여전히 작업 초안) Firefox support for text-overflow

Answer 4

/*ellipsis stuff*/ 
    white-space: nowrap; 
    overflow: hidden; 
    text-transform: none; 
    text-overflow: ellipsis; /* IE 6+, FF 7+, Op 11+, Saf 1.3+, Chr 1+*/ 
    -o-text-overflow: ellipsis; /* for Opera 9 & 10 */ 
    -ms-text-overflow: ellipsis; /*IE 8*/ 

OBS의
Browser support for text-overflow
트랙 상태 : 또한, 바람직한 크기의 너비를 설정