JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
    <div class="itemrow">
        <div class="item1">1</div>
        <div class="item1">2</div>
    </div>
    <div class="itemrow">
        <div class="item2">3</div>
        <div class="item1">4</div>
    </div>
    <div class="itemrow">
        <div class="item2">5</div>
        <div class="item1">6</div>
    </div>
    <div class="itemrow">
        <div class="item1">7</div>
        <div class="item2">8</div>
    </div>
    <div class="itemrow">
        <div class="item1">9</div>
    </div>
</div>

CSS

#container
        {
            width: 400px;
        }
        .itemrow
        {
            float: left;
            clear: both;
        }
        .item1
        {
            width: 180px;
            height: 200px;
            border: 1px solid red;
            float: left;
            margin: 10px 0 0 10px;
        }
        .item2
        {
            width: 190px;
            height: 250px;
            border: 1px solid red;
            float: left;
            margin: 10px 0 0 10px;
        }