JSFiddle - React, Tailwind, and code Playground

by Guruprasad Rao

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);
    var content=$(this).contents();
    content.wrap('<div class="wrapped"/>');
    var raiseContent=$(this).find('.wrapped');
    var currentSize = 10;
    while (currentSize < 150) {
        raiseContent.css({fontSize:currentSize});
        console.log(raiseContent.height() + " : " + element.height());
        if (raiseContent.height() > element.height())
            break;
        currentSize++;
    }
    element.css({fontSize:currentSize});
    content.unwrap();
});