JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<head>
</head>
<body>
is situation:
	<div class="a">
		<div class="b"> <!--The one you want to "ignore" -->
          <div class="b-child"></div> <!--The absolute positioned child -->
		</div>
		<div class="c">
		</div>
		<div class="d">
		</div>
	</div>
</body>
</html>

CSS

.a {
   display: flex;
	 border: 1px solid black;
   overflow: hidden;
}
.a2 {
   display: flex;
   max-height: 250px;
   border: 1px solid black;
}
.b {
  width: 50px;
  position: relative;
}
.b .b-child {
  top: 0;
  left: 0;
  width: 100%;
  height: 300px;
  position: absolute;
  border: 1px solid green;
	background-color: green;
}
.c {
  height: 200px;
	width: 50px;
	border: 1px solid blue;
	background-color: blue;
}
.d {
  height: 250px;
	width: 50px;
	border: 1px solid red;
	background-color: red;
}