Poignée de redimensionnement de textarea cache dans Safari

Question

Je suis à l'aide de composants textarea dans mon application, et je contrôle leur hauteur, de façon dynamique. Comme les types d'utilisateurs, la hauteur est augmentée à chaque fois qu'il y a assez de texte. Cela fonctionne très bien sur IE, Firefox et Safari.

Cependant, dans Safari, il y a une "poignée" d'outil en bas à droite qui permet à l'utilisateur de redimensionner la zone de texte en cliquant et en faisant glisser. J'ai aussi remarqué ce problème avec le textarea dans le stackoverflow Poser une Question la page. Cet outil est source de confusion et, fondamentalement, est dans la manière.

Alors, est-il de toute façon à masquer cette poignée de redimensionnement?

(Je ne sais pas si la "poignée" est le mot juste, mais je ne vois pas de meilleur terme.)

Answer 1

Vous pouvez substituer le comportement de redimensionnement avec CSS :

ou tout simplement

Propriétés valides sont : les deux, horizontale, verticale, aucun

Answer 2

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

textarea {
    resize: none;
}

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

Pour désactiver un spécifique TextArea avec l' name attribut foo (c'est à dire, <TextArea name="foo"></TextArea>):

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

Ou, à l'aide d'un ID (c'est à dire, <TextArea id="foo"></TextArea>):

#foo {
    resize: none;
}

Notez que cela n'est pertinent que pour WebKit navigateurs (c'est à dire, Safari et Chrome), ajouter la poignée de redimensionnement d' TextArea des contrôles.

Answer 3

l’occasion de max-largeur-hauteur max safari fonctionne également dans firefox 4.0 (b3pre). bon exemple ici d’ailleurs : http://www.alanedwardes.com/posts/safari-and-resizable-textboxes/