JSFiddle - React, Tailwind, and code Playground
HTML
<div id="divone" class="area">
<div class="hitbox"></div>
<div class="scaling"></div>
</div>
<div id="divtwo" class="area">
<div class="hitbox"></div>
<div class="scaling"></div>
</div>
CSS
.area
{
overflow: visible;
width:100px;
height:100px;
position: relative;
}
.scaling, .hitbox{
position: absolute;
top: 0; left: 0;
width: 100px; height: 100px;
}
.hitbox{
z-index: 3;
}
.hitbox:hover+.scaling
{
-webkit-transform: scale(2);
z-index: 2;
}
#divone .scaling
{
background-color:red;
}
#divtwo .scaling
{
background-color:blue;
}