JSFiddle - React, Tailwind, and code Playground

HTML

<form>
    1<input type="text" id="test" name="test" />
    2<input type="text" id="test2" name="test" />
</form>
<div id="dimensions"></div>
<div id="texte"></div>

CSS

#texte {
    background: grey;
}

JavaScript

$(document).ready(function () {
    $("#test, #test2").keyup(function () {
        var width = $("#test").val();
        var height = $("#test2").val();
        var max = 200;
        var min = 20;
        
    var ratio;
    if(width>=height){
      ratio = max / width;
      width = ratio * width;
      height = height * ratio;
    } else {
        ratio = max / height;
        height = ratio * height;
        width = width * ratio;
     };
         $("#dimensions").html(width + " x " + height);
        $("#texte").css({ "width":width + "px", "height":height + "px" });

    });
});