Ukrywanie uchwytu zmiany rozmiaru obszaru tekstowego w Safari

W mojej aplikacji używam komponentów textarea i dynamicznie kontroluję ich wysokość. Gdy użytkownik pisze, wysokość jest zwiększana, gdy jest wystarczająco dużo tekstu. Działa to dobrze w IE, Firefox i Safari.

Jednak w przeglądarce Safari w prawym dolnym rogu znajduje się narzędzie „uchwyt”, które umożliwia użytkownikowi zmianę rozmiaru obszaru tekstu poprzez klikanie i przeciąganie. Zauważyłem również ten problem z obszarem tekstowym na stronie Zadaj pytanie w przepływie stosu. To narzędzie jest mylące i w zasadzie przeszkadza.

Czy w ogóle można ukryć ten uchwyt zmiany rozmiaru?

(Nie jestem pewien, czy „uchwyt” to właściwe słowo, ale nie mogę wymyślić lepszego terminu).

Możesz nadpisać zachowanie zmiany rozmiaru za pomocą CSS:

textarea
{
   resize: none;
}

lub po prostu

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

Prawidłowe właściwości to: both, horizontal, vertical, none

Użyj następującej reguły CSS, aby wyłączyć to zachowanie dla wszystkich TextAreaelementów:

textarea {
    resize: none;
}

Jeśli chcesz go wyłączyć dla niektórych (ale nie wszystkich) TextAreaelementów, masz kilka opcji (dzięki tej stronie ).

Aby wyłączyć określony TextAreaz nameatrybutem ustawionym na foo(tj. <TextArea name="foo"></TextArea>):

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

Lub używając identyfikatora (tj. <TextArea id="foo"></TextArea>):

#foo {
    resize: none;
}

Należy zauważyć, że dotyczy to tylko przeglądarek opartych na WebKit (tj. Safari i Chrome), które dodają uchwyt zmiany rozmiaru do TextAreaelementów sterujących.

opcja safari max-height max-width działa również w przeglądarce Firefox 4.0 (b3pre). przy okazji dobry przykład: http://www.alanedwardes.com/posts/safari-and-resizable-textboxes/