JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrap">
    <div id="c1" class="contenedor">
        <div class="columna_izquierda">lorem ipsum dolor amet</div>
        <div class="columna_derecha">lorem ipsum dolor amet. lorem ipsum dolor amet. lorem ipsum dolor amet.</div>    
    </div>
    <div id="c2" class="contenedor">
        <div class="columna_izquierda"></div>
        <div class="columna_derecha">lorem ipsum dolor amet. lorem ipsum dolor amet. lorem ipsum dolor amet.</div>    
    </div>
</div>

CSS

body{ font:16px arial;}
#wrap{ width:300px;}
.contenedor{ width:100%; overflow:hidden; margin:0 0 20px 0;}
.contenedor > div{ float:left; height:100px;}
.columna_izquierda{ background:#000; color:#fff}
.columna_derecha{ background:#f0f0f0;}

.cero{width:0;}
.veinte{width:20%;}
.ochenta{width:80%;}
.cien{width:100%;}

JavaScript

var texto = $(".columna_izquierda").html();

if(texto == ""){ 
    //acciones a ejecutar si esta vacĂ­o
    $("#c2 .columna_izquierda").removeClass("veinte").addClass("cero");
    $("#c2 .columna_derecha").removeClass("ochenta").addClass("cien");
}
else{
    //si tiene texto...
    $("#c1 .columna_izquierda").removeClass("cero").addClass("veinte");
    $("#c1 .columna_derecha").removeClass("cien").addClass("ochenta");
}