JSFiddle - React, Tailwind, and code Playground

HTML

<div class="all">
    <div class="normal"></div>
    <div class="normal"></div>
    <div class="normal"></div>
    <div class="highlighted"></div>
</div>

<div class="all">
    <div class="normal"></div>
    <div class="highlighted"></div>
    <div class="normal"></div>
    <div class="normal"></div>
</div>

CSS

.all > div { 
    width: 100px; 
    display: inline-block;
    height: 100px;
}
.normal:nth-of-type(1) { background: red; } 
.normal:nth-of-type(2) { background: blue; }
.normal:nth-of-type(3) { background: green; }
.highlighted { background: yellow; }