contenteditable overflow-x 너비가 계속 확장 됨 : 100 %

Question

컨테이너의 100 %를 채우기 위해 contenteditable div이 있습니다.

div는 문체 것들 중, 적용 다음 스타일이 있습니다

width: 100%; 
max-width: 100%; 
height: 480px; 
overflow-x: auto; 
overflow-y: scroll; 
word-wrap: break-word; 
overflow-wrap: break-word 

문제는 텍스트가 수평으로 랩 적이 있다는 것입니다. width 및 max-width이 설정되었지만 각 행의 길이가 원래 너비를 초과하면 div은 계속 확장됩니다.

속성을 명시적인 수량으로 변경합니다 (예 : 960px은 원하는 효과를냅니다. div은 정의 된 크기로 유지되고 라인의 명백한 끝 부분에 도달하면 수평 텍스트가 그 안에 래핑됩니다. 나는 contenteditable div가 그것의 부모의 100 %를 소모하더라도 원한다. 텍스트 입력시 무한대로 수평을 확장하지 않고 어떻게 부모를 채우게합니까?

Ilmiont

Answer 1

당신은`에 width` 컨테이너의 하드 값을 설정

text-overflow:ellipsis;