Very short trick: disable the resizing of a textarea on Safari

In any browser developed starting from the rendering engine WebKit (by appointment as Safari or Google Chrome ), the fields textarea show, bottom right, the characteristic feature of resizing. If this peculiarity may prove very useful in some cases, in others it becomes a nuisance element. Fortunately, you can control this behavior directly from the style sheet, simply by acting in CSS using resize :

1
2
3
4
/ * Supports auto, Both, horizontal, none, vertical * /
textarea {
; resize: none;
}

7 comments: "Very short trick: disable the resizing of a textarea on Safari"

  1. February 5, 2009 Engelium :

    Hello

    but this property is applicable to other browsers (thus allowing scaling of FF or Opera for example) or is an extension of the owner of webkit?

  2. February 5, 2009 Giovambattista Fazioli :

    @ Engelium: resize part of CSS 3 partially supported by the various browsers available. WebKit, Safari and Chrome then, are the only - I know - that have already implemented. . As part of the specific W3C/CSS3, should be supported in future releases of browsers like FireFox, Opera, etc. ... for the worst, as already happens with the border-radius , will use different names, such as -moz-resize . For FireFox, however, as well as various scripting Javascript "amule" such behavior, there is also an add-on Resizeable Textarea

  3. February 5, 2009 Engelium :

    Well I was interested as a webmaster so the fact that there are addons I userjs or changes little

    thanks for the answer

  4. February 6, 2009 SXE:

    That's just what I wanted.

    Thank you!

    And congratulations for articles.

  5. February 9, 2009 The week in "Graphics" # 1 - viklog :

    [...] Very short trick: disable the resizing of a textarea on Safari [...]

  6. February 9, 2009 Napolux :

    So it is not valid CSS2 and CSS3?

    Mmmmm ....

  7. February 9, 2009 Giovambattista Fazioli :

    @ Napolux:

    So it is not valid CSS2 and CSS3?

    as you know the latest browsers have begun to support - in part - CSS3. I think that where both the supported CSS3 resize it and then you can disable it. In those that do not supprot this approach goes unnoticed ... or at least I hope :)

Leave a comment

XHTML TAG PERMIT: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> INSERTION CODE:
 <pre></pre> // blocco generico <code></code> // blocco generico [cc_actionscript][/cc_actionscript] // Actionscript [cc_actionscript3][/cc_actionscript3] // Actionscript 3 [cc_css][/cc_css] // CSS Style Sheet [cc_html][/cc_html] // HTML [cc_js][/cc_js] // Javascript [cc_objc][/cc_objc] // Objective-C [cc_php][/cc_objc] // PHP [cc_sql][/cc_sql] // SQL 


Stop SOPA