JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrapper">
    <div id="a">1</div>
    <div id="b">2</div>
    <div id="c">3</div>
    <div id="d">4</div>
    <div id="e">5</div>
</div>

CSS

#wrapper {
    margin: 0 auto;
    width: 120px;
}

#a, #b, #c, #d, #e {
    width: 50px;
    height: 50px;
    margin-bottom: 10px;
}

#a { background-color: red; }
#b { background-color: green; }
#c { background-color: yellow; }
#d { background-color: orange; }
#e { background-color: black; }

#a, #c, #e {
    float: left;
}

#b, #d {
    float: right;
}