JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrapper">
    <div id="sub-menu">
        <div id="left-column" class="column">
            Agenda</br>
            Here I put some texte                                    
        </div>
        <div id="right-column" class="column">
            sdfdsf                          
        </div>
    </div>


</div>

CSS

body{
    background-color:#E5E5E5;}

#wrapper{
    background-color:#FFFFFF;
    width:800px;
    margin-left:auto;
    margin-right:auto;
    overflow:auto;}

#sub-menu{
    margin:10px;
    width:780px;
    position:relative;
    display: table;}

.column{
    display: table-cell;}

#left-column{
    width:500px;
    background-color:yellow;}

#right-column{
    width:280px;
    background-color:magenta;}

JavaScript

var $toEqualize = $('.column');
    $toEqualize.css('height', (function(){
        return Math.max.apply(null, $toEqualize.map(function(){
            return $(this).height();
        }).get());
    })());