JSFiddle - React, Tailwind, and code Playground

HTML

<div id="cont">
    <div class="block a1">1er</div>
    <div class="block b2">2eme</div>
    <div class="block c3">3eme</div>
    <div class="block d4">4eme</div>
</div>

CSS

#cont{width:100%;}
.block{width:50%;}

.block:nth-child(even){float: right;}
.block:nth-child(odd){float: left;}

.a1{
    height:30px;
    background-color:#555;
}
.b2{
    height:50px;
    background-color:#aaa;
}
.c3{
    height:100px;
    background-color:#222;
    color:white;
}
.d4{
    height: 20px;
    background-color:#ddd;
}