문제

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

그러나 Safari에는 오른쪽 하단에 "핸들"도구가있어 사용자가 클릭하고 드래그하여 Textarea를 크기를 조정할 수 있습니다. 또한 StackoverFlow에서 TextRea와 관련 하여이 문제를 알았습니다. 이 도구는 혼란스럽고 기본적으로 방해가됩니다.

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

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

도움이 되었습니까?

해결책

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

textarea
{
   resize: none;
}

또는 간단히

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

유효한 속성은 다음과 같습니다. 둘 다, 수평, 수직, 없음

다른 팁

다음 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;
}

이것은 webkit 기반 브라우저 (즉, 사파리 및 크롬)와 관련이 있으며,이 크기 조정 핸들을 추가하십시오. TextArea 통제 수단.

Safari Max-Height Max-Width 기회는 Firefox 4.0 (B3PRE)에서도 작동합니다. 그건 그렇고 여기에 좋은 예 : http://www.alanedwardes.com/posts/safari-and-regizable-textboxes/

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top