JSFiddle - React, Tailwind, and code Playground

HTML

<div class='things'>
    <div class='box'>1</div>
    <div class='box'>2</div>
    <div class='box'>3</div>
    <div class='box'>4</div>
    <div class='box'>5</div>
    <div class='box'>6</div>
    <div class='box'>7</div>
    <div class='box'>8</div>
    <div class='box'>9</div>
    <div class='box'>10</div>
</div>

CSS

.things{
    width:100%;
}
.box{
    width:50%;
    background:#ccc;
    float: left;
    box-shadow:0 0 3px rgba(0,0,0,.25) inset;
    margin:.25em 0;
    text-align:center;
    padding:1em 0;
}
.box:nth-child(3n+1){
    width:100%;
    background:#eee
}