CSS, Adjustable-size Textarea

What am I missing?

[digitalv]

You would think this would be somewhat simple, but I guess not... not for me at least.

I'm trying to make a simple text editor in a web page, and want the <textarea> to expand to utilize all of the width and height available in the browser - the trouble is that there is some other stuff above it and below it, and when I try to do anything with height:100%; it's ignoring my other content. Since the content is dynamic, I can't use fixed heights anywhere, so there is no way for me to work it out mathematically in pixels.

Basically the end result would be that all of the content on the page is pretty much static, except if the user resizes their browser only the width and height of the <textarea> changes, expanding and contracting to fill any available space, but never causing a vertical scroll bar to appear.

How can I do this?

[D_Blackwell]

I wouldn't be too concerned about the stuff above and below. It should be fine when the textarea question is answered. The 100% width: is simple enough (though I would chop of a couple of points and center to be safe), but browsers will choke on height: declared in a percentage - height: of what? - and so it won't work.

Auto-resizing the textarea according to the viewport space, with no scrollbar, is easy enough with px or em, but 100% height requires a JS solution so far as I know. I believe that I've also seen it done with an iframe, but seemed more of hack than the JS options which should be searchable.