David Walker | 27 June 2012
In the current release of all desktop browsers (except IE9) something odd has happened to text area controls. All of a sudden we have resizable text areas with absolutely no constraint in how big they can get. This of course will play merry hell in the flow of your document.
The textarea bydefault is taking advantage of a CSS3 feature called resize. Any block element could have the following CSS added to it so a textarea is now coming as default as if I had done this:
A pretty swanky piece of easy CSS for those accordion style displays but you often want to control it. There are two ways you can deal with this:
1. Switch it off
If you dislike the idea of user s being able to resize the box or want a consistent experience do the following:
This means everything behaves the same as it ever was.
2. Constrain it
Personally I do not mind the resizing concept I just want it to be constrained to the proportions of the parent element more effectively. If you want to give users the ability to resize but constrain their power try:
Or switch to resize on one axis only be using resize: horizontal; or resize: vertical;