JSFiddle - React, Tailwind, and code Playground

by kthornbloom

HTML

<input type="text" value="Initial Value" class="sizer">

<input type="text" value="" placeholder="edit me" class="sizer">

JavaScript

const e = document.querySelectorAll('.sizer');
for (var i = 0; i < e.length; i++) {
		if (e[i].value){
			sizer(e[i]);
    }
    e[i].addEventListener('input', function(){
    sizer(this);
    }, false);
}
function sizer(e){
	e.style.width = 0; e.style.width = e.scrollWidth + 'px';
}