JSFiddle - React, Tailwind, and code Playground

HTML

<body>
	первый пример
	<div class="parent"> <span>родительский ДИВ перекрывающий дочерний</span>
		<div class="affiliate"> <span>дочерний ДИВ<br>дочерний ДИВ</span>
		</div>
	</div>
	<br><br><br><br><br><br>
	
	<hr>
	второй пример
	<div class="parent-2"> <span>родительский ДИВ перекрывающий дочерний</span>
		<div class="affiliate-2"> <span> дочерний ДИВ<br>дочерний ДИВ</span>
		</div>
	</div>
</body>

CSS

.parent {
	background: gray;
	position: relative;
	top: 20px;
}
.affiliate {
	background: yellow;
	height: 100px;
  width: 200px;
	position: absolute;
	top: -20px;
	left: 300px;
	z-index: -1;
}
.parent-2 {
	background: gray;
	position: relative;
	top: 20px;
	z-index: 0;
}
.affiliate-2 {
	background: yellow;
	height: 100px;
  width: 200px;  
  position: absolute;
	top: -20px;
	left: 300px;
	z-index: -1;
}
.parent span, .parent-2 span
    {
       background: orange;
    }
.affiliate span, .affiliate-2 span
    {
       background: #800080;
    }