JSFiddle - React, Tailwind, and code Playground
HTML
<div id="myTest" class="maximize_size">
Test
</div>
CSS
#myTest {
width: 250px;
height: 40px;
border: 1px solid #000;
font-family: Lucida Console;
}
JavaScript
$(".maximize_size").each(function(){
var element = $(this),
currentSize = 10;
while (currentSize < 150) {
element.css({"font-size": currentSize + "px"});
if(element[0].scrollHeight > element.height()) {
break;
}
currentSize++;
}
element.css({"font-size": currentSize + "px"});
});