JSFiddle - React, Tailwind, and code Playground

by theLitek

HTML

pointer event example:
<div class="parent">
    parent
    <div class="child">
        child
    </div>
</div>    
another element 
<div class="parent-2">
    <div class="content">
        parent 
    </div>
    
    <div class="child">
        child
    </div>
</div>

CSS

.parent-2,
.parent { position:relative; background:#ddd; width:100px; height:100px; }
.parent:hover { background:blue; }
.child { position:absolute; top:0; left:130px; width:100px; height:50px; border:1px solid blue; pointer-events:none; }
/* doesn't work in opera and ie */


.content { position:absolute; top:0; left:0; width:100%; height:100%; z-index:0;}
.content:hover { background:blue; }