JSFiddle - React, Tailwind, and code Playground

HTML

Max width : <input id=width value=200> px
<br>Max height : <input id=height value=20> px
<br><br>
<table border=1><tr><td id=txtcell nowrap><span id=txt style=>Some sample text.</span></td></tr></table>
<br>Font Size : <span id=mes></span>

JavaScript

var fontSize = 100;
var reduce = function() {
    $('#txt').css('font-size', fontSize);
    $('#mes').html(fontSize);
    if ($('#txt').width()>$('#width').val() || $('#txt').height()>$('#height').val()) {
       fontSize -= 1;
       setTimeout(reduce, 1);
    }
};
reduce();
$('#width, #height').change(function(){fontSize = 100;reduce()});