JSFiddle - React, Tailwind, and code Playground

by LimitedWard

HTML

<div class="parent">
    <div class="left">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam veniam tempore pariatur eos vero perspiciatis qui illum dolorum quae incidunt consequuntur atque exercitationem aliquam maxime reprehenderit. Culpa at expedita iusto.
    </div>
    <div class="right"></div>
</div>

CSS

.parent {
    background:red;
    position:relative;
    width:100%;
}
.left{
    background:lightblue;
    float:left;
    width:75%;
}
.right {
    background:green;
    width:25%;
    float:right;
}

JavaScript

$(function() {
    $('.left').height('auto');
    $('.right').height('auto');
    var leftHeight = $('.left').height();
    var rightHeight = $('.right').height();
    
    if (leftHeight > rightHeight) {
        $('.right').height(leftHeight);
    } else {
        $('.left').height(rightHeight);
    }
    
    $(window).resize(function() {
        $('.left').height('auto');
        $('.right').height('auto');
        var leftHeight = $('.left').height();
        var rightHeight = $('.right').height();
        
        if (leftHeight > rightHeight) {
            $('.right').height(leftHeight);
        } else {
            $('.left').height(rightHeight);
        }
    });
});