Masquer la poignée de redimensionnement de la zone de texte dans Safari

J'utilise des composants textarea dans mon application et je contrôle leur hauteur de manière dynamique. Au fur et à mesure que l'utilisateur tape, la hauteur augmente chaque fois qu'il y a suffisamment de texte. Cela fonctionne bien sur IE, Firefox et Safari.

Cependant, dans Safari, il existe un outil «poignée» en bas à droite qui permet à l'utilisateur de redimensionner la zone de texte en cliquant et en faisant glisser. J'ai également remarqué ce problème avec la zone de texte dans la page Poser une question de stackoverflow. Cet outil est déroutant et gêne fondamentalement.

Alors, est-il possible de masquer cette poignée de redimensionnement?

(Je ne sais pas si "gérer" est le bon mot, mais je ne peux pas trouver de meilleur terme.)

Vous pouvez remplacer le comportement de redimensionnement avec CSS:

textarea
{
   resize: none;
}

ou tout simplement

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

Les propriétés valides sont: both, horizontal, vertical, none

Utilisez la règle CSS suivante pour désactiver ce comportement pour tous les TextAreaéléments:

textarea {
    resize: none;
}

Si vous souhaitez le désactiver pour certains éléments (mais pas tous) TextArea, vous avez quelques options (grâce à cette page ).

Pour désactiver un spécifique TextAreaavec l' nameattribut défini sur foo(c'est- à -dire <TextArea name="foo"></TextArea>):

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

Ou, en utilisant un identifiant (c'est-à-dire <TextArea id="foo"></TextArea>):

#foo {
    resize: none;
}

Notez que cela n'est pertinent que pour les navigateurs basés sur WebKit (c'est-à-dire Safari et Chrome), qui ajoutent la poignée de redimensionnement aux TextAreacontrôles.

l'opportunité safari max-height max-width fonctionne également dans firefox 4.0 (b3pre). bon exemple ici au fait: http://www.alanedwardes.com/posts/safari-and-resizable-textboxes/