JSFiddle - React, Tailwind, and code Playground

by Maksim

HTML

<div class="h-txt left">TXT box</div>
<div class="h-img right">IMG BOX that's higher and higher and higher and higher and higher and higher and higher and higher and higher and higher and higher and higher and higher and higher and higher and higher and higher and higher and higher</div>

CSS

.left {
    background: red;
    float: left;
}
.right {
    background: blue;
    float: right;
    max-width: 40%;
}

JavaScript

$(window).resize(function (e) {
    $(".h-txt, .h-img").css("height", "auto");
    var height = Math.max($(".h-txt.left").height(), $(".h-img.right").height());
    $(".h-txt.left").height(height);
    $(".h-img.right").height(height);
});

$(window).trigger("resize");