JSFiddle - React, Tailwind, and code Playground

HTML

<div class="main">la la 
<div class="over">lah lah lah </div>
<div class="under">lah lah lah </div>

CSS

.main {
	background-color: black;
	width: 600px;
	height: 600px;
}
.over {
	background-color: orange;
	position: relative;
	top: 10px;
	left:10px;
	height: 100px;
	width: 100px;
	z-index: 2;
}
.over:hover {
	opacity: 0;
}
.under {
	background-color: blue;
	position: relative;
	top: -90px;
	left:10px;
	height: 100px;
	width: 100px;
	z-index: 1;
}