JSFiddle - React, Tailwind, and code Playground

HTML

<div class="div1"><div class="div2"></div></div>

CSS

.div1{
    width:200px;
    height:200px;
    background-color:red;
    overflow: hidden;
}

.div2{
    width:50px;
    height:50px;
    background-color:blue;
}

.div1:hover{
    background:yellow;
}
.div2:hover{
    background:green;
    outline: 999em red solid ;
}