JSFiddle - React, Tailwind, and code Playground

HTML

<div class="holder">
    <div class="one card"></div>
    <div class="two card"></div>
    <div class="three card"></div>
</div>
<div class="holder">    
    <div class="three card"></div>    
    <div class="two card"></div>
    <div class="one card"></div>
</div>

CSS

.holder{
    float:left;
}
.card{
    width: 100px;
    height:100px;
    display: inline-block;
}
.one{
    background: green;
}
.two{
    background: red;
}
.three{
    background: blue;
}
@media screen and (max-width: 300px){
    .card{
        display: block;
    }
}