Is there anyway to have a textarea “autofit” height based on the content at page load?

Question

Is there anyway through CSS or Javascript set the height of the textarea based on the content? I have a hardcoded height in my CSS but i wanted it to default so there is no

Answer 1

This work for me

$(function(){
    $('body').on('keydown','textarea', function(event) {
        if ($('textarea')[0].clientHeight < $('textarea')[0].scrollHeight)
        {
            $('textarea').css({'height': $('textarea')[0].scrollHeight+"px"});
        }
        else
        {
            // reset height to default value
            $('textarea').css({'height': ''});
        }
    });
});