Cacher la poignée de redimensionnement de textarea dans Safari

J’utilise des composants textarea dans mon application et je contrôle dynamicment leur hauteur. Lorsque l’utilisateur tape, la hauteur est augmentée chaque fois qu’il y a suffisamment de texte. Cela fonctionne très bien sur IE, Firefox et Safari.

Cependant, dans Safari, il existe un outil “handle” 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 Pile de questions. Cet outil est déroutant et fait obstacle.

Alors, y a-t-il un moyen de cacher cette poignée de redimensionnement?

(Je ne suis pas sûr que “handle” soit le bon mot, mais je ne peux pas penser à un meilleur terme.)

Vous pouvez remplacer le comportement de redimensionnement avec CSS:

textarea { resize: none; } 

ou tout simplement

  

Les propriétés valides sont: les deux, horizontales, verticales, aucune

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

 textarea { resize: none; } 

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

Pour désactiver un object TextArea spécifique avec l’atsortingbut name défini sur foo (par exemple, ):

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

Ou, en utilisant un ID (par exemple, ):

 #foo { resize: none; } 

Notez que cela ne concerne que les navigateurs WebKit (Safari et Chrome), qui ajoutent la poignée de redimensionnement aux contrôles TextArea .

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