Safari에서 텍스트 영역 크기 조정 핸들 숨기기

Safari에서 텍스트 영역 크기 조정 핸들 숨기기

---

내 응용 프로그램에서 텍스트 영역 구성 요소를 사용하고 있으며 높이를 동적으로 제어합니다. 사용자가 입력하면 텍스트가 충분할 때마다 높이가 증가합니다. 이것은 IE, Firefox 및 Safari에서 잘 작동합니다.

그러나 Safari에는 오른쪽 하단에 "핸들"도구가있어 사용자가 클릭하고 드래그하여 텍스트 영역의 크기를 조정할 수 있습니다. 또한 stackoverflow Ask a Question 페이지의 텍스트 영역에서이 문제를 발견했습니다. 이 도구는 혼란스럽고 기본적으로 방해가됩니다.

그래서 어쨌든이 크기 조정 핸들을 숨길 수 있습니까?

( "handle"이 올바른 단어인지 확실하지 않지만 더 나은 용어를 생각할 수 없습니다.)

---

CSS로 크기 조정 동작을 재정의 할 수 있습니다.

textarea
{
   resize: none;
}

또는 단순히

<textarea style="resize: none;">TEXT TEXT TEXT</textarea>

유효한 속성 : both, horizontal, vertical, none

---

다음 CSS 규칙을 사용하여 모든 TextArea요소에 대해이 동작을 비활성화합니다 .

textarea {
    resize: none;
}

일부 (전부는 아님) TextArea요소에 대해 비활성화 하려면 몇 가지 옵션이 있습니다 ( 이 페이지 덕분에 ).

특정하지 않으려면 TextArea와 name에 속성 세트를 foo(예 <TextArea name="foo"></TextArea>) :

textarea[name=foo] {
    resize: none;
}

또는 ID 사용 (예 :) <TextArea id="foo"></TextArea>:

#foo {
    resize: none;
}

이는 TextArea컨트롤에 크기 조정 핸들을 추가하는 WebKit 기반 브라우저 (예 : Safari 및 Chrome)에만 해당됩니다 .

---

safari max-height 최대 너비 기회는 firefox 4.0 (b3pre)에서도 작동합니다. 좋은 예 : http://www.alanedwardes.com/posts/safari-and-resizable-textboxes/

참고 URL : https://stackoverflow.com/questions/588089/hiding-textarea-resize-handle-in-safari