JSFiddle - React, Tailwind, and code Playground
HTML
<textarea id="autosize">his is an epicly long string. This is an epicly long string. This is an epicly long string. This is an epicly long string. This is an epicly long string. This is an epicly long string. This is an epicly long string. This is an epicly long string. This is an epicly long string. This is an epicly long string. This is an epicly long string. This is an epicly long string. This is an epicly long string. This is an epicly long string. This is an epicly long string. This is an epicly long </textarea>
JavaScript
var ta = document.getElementById('autosize');
textareaSetSize(ta, 500);
//for better precision width should be > 100
function textareaSetSize(elem, width)
{
var length = elem.value.length;
//about 11 characters per 100 pixels
var estimatedLines = Math.round(length/(width/100*11));
//alert('Estimated number of lines: ' + length);
elem.style.width = width + 'px';
elem.rows = estimatedLines;
}
for(var i = 0; i < selector.length; i++)
{
selector[i].onkeyup = function(){
textareaSetSize(this, 400);
};
}