textarea
의 패딩은 항상 고정되어 있습니다. 텍스트 영역의 텍스트 내용이 스크롤되면 패딩이 가장자리 근처에 유지됩니다.contenteditable 요소의 고정 된 패딩
contenteditable
요소의 패딩은 다르게 동작합니다. 요소의 텍스트 내용이 스크롤되면 패딩이 함께 이동합니다.
This demo은 그 차이점을 설명합니다.
contenteditable
요소는 스타일이 적용되어 패딩이 텍스트 콘텐츠가 스크롤되는 동안 textarea
패딩과 같은 모양으로 동작합니다.
좋은 질문입니다. 본질적으로'contenteditable' 엘리먼트는 다른 블록 엘리먼트처럼 행동하기 때문에'contenteditable' 엘리먼트와 다른 일반 엘리먼트 사이를 구별 할 수 있을지, 또 그렇게해야하는지 궁금합니다. – BoltClock
그리고': after'도 스크롤됩니다 ... :) 왜'textarea'를 사용하지 않습니까? :) 어떤 점에서, 헌신적 인 형태 요소를 시뮬레이션하는 것은 정말로 털이 많다 :) – sodawillow
언뜻 보면 이상하게 보인다. 차이점은 텍스트는 텍스트 영역 내에서 수직 중심에 위치 할 수 없지만'display : flex'를 사용하여'contenteditable' 요소 내에서 수직 중심에 위치 할 수 있다는 것입니다. [이 데모] (http://jsfiddle.net/jyuko6gx/4/)를 참조하십시오. 나는 텍스트가 수직 중심에 있어야하므로'textarea '는하지 않을 것이다. –