Changing text field size vertically and/or horizontally using CSS or javascript?

I have a regular input field 开发者_StackOverflow中文版<input type="text" name="abc" /> that I want to automatically resize and expand as text is entered it so that all the text entered is always showing. Is there a way of doing this using CSS or javascript?

// You don't mention jquery, you may be able to use something like this:

var who= document.getElementsByName('abc')[0];
who.onkeypress= who.onchange= function(e){
    e= e? e.target: window.event? event.srcElement: '';
    var val= e.value? e.value.length: 20;
    // set a minimum length,  in input 'size' attribute
    if(val> 18) e.size= val+2;
    return true;
}

An input is inline, if you want linebreaks use a textarea, and expand it vertically when the scrollHeright is greater than the offsetHeight.