JSFiddle - React, Tailwind, and code Playground

by rafalry

HTML

<div class="parent1" style="width:400px;border:1px solid black;position:relative">
    <div class="child1 wrong" style="width:50px" >WRONG</div>
    <div class="podkladka" ></div>
</div>
<div class="parent1" style="width:400px;border:1px solid black;position:relative">
    <div class="child1 correct" style="width:50px" >CORRECT</div>
    <div class="podkladka" ></div>
</div>
<div class="parent1" style="width:400px;border:1px solid black;position:relative">
    <div class="child1" style="width:50px" >NONE</div>
    <div class="podkladka"></div>
</div>

CSS

.podkladka  {
    display:none;
    width:100%; height:100%; position:absolute;left:0px;top:0px;z-index:-1;
}
.correct + .podkladka  {    
    display:block;
    background-color:green;
}
.wrong + .podkladka  {    
    display:block;
    background-color:red;
}