JSFiddle - React, Tailwind, and code Playground

HTML

<div class='outside'>
<div class='inside'></div>
</div>

CSS

.outside{
    height:112px;
    width:120px;
    background:tomato;
}
.inside{
 background:#eee;
    height:50px;
    width: 50px;
    margin: 0px auto;
    opacity: 0;
    visibility: hidden;
}
.outside:hover .inside{
    visibility: visible;
    opacity: 1;
    -webkit-transition: .25s;
    -moz-transition: .25s;
    -o-transition: .25s;
    -ms-transition: .25s;
}