JSFiddle - React, Tailwind, and code Playground

HTML

<div class="conteudo">
    <div class="esquerda"></div>
    <div class="direita">
        <div>
            <div></div>
        </div>
    </div>
    <div class="clear"></div>
</div>

CSS

div {
    padding: 50px;
    border: 2px solid black;
}
.esquerda {
    height: 100%;
    float: left;
}
.direita {
    float: right;
}
.clear {
    clear: both;
}

JavaScript

var $direita = $('.direita');
var alturaInicial = 0;
$direita.on('resize change', function () {
    $('.esquerda').height($(this).height());
});

setInterval(function () {
    var novaAltura = $direita.height();
    if (alturaInicial != novaAltura) $direita.resize();
    alturaInicial = novaAltura;
}, 100);


// ISTO É SÓ PARA EXEMPLO SER MAIS CLARO
setInterval(function () {
    $('.direita').append('<p>Aqui vai mais texto... lá lá lá...</p>');
}, 1000);