JSFiddle - React, Tailwind, and code Playground

by Juan Muñoz

HTML

<div>
    <div id='arriba'>
        <div id='aizquierda'>
        </div>
        <div id='aderecha'>
        </div>
    <div>
    <div id='abizquierda'>
    </div>
    <div id='abderecha'>
    </div>
</div>

CSS

#arriba{
    width: 1000px;
    height:200px;
}
#abajo{
    width: 1000px;
    height:500px;
}
#aizquierda{
    float:left;
    background-color: red;
    width: 400px;
    height: 200px;
}
#aderecha{
    float:right;
    background-color: blue;
    width: 600px;
    height: 200px;
}
#abizquierda{
    float:left;
    background-color: yellow;
    width: 400px;
    height: 500px;
}
#abderecha{
    float:right;
    background-color: black;
    width: 600px;
    height: 500px;
}