JSFiddle - React, Tailwind, and code Playground

by Green_X5

HTML

<!doctype html>
<html lang="en">

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
</head>
<body>
	<div class="container-fluid">
		  <div class="row dual">
				 <div class="col"></div>
				 <div class="col parentline">
						<div class="row upline"></div>
				 </div>
		  </div>
	</div>
  <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/feather.min.js"></script>
</body>

CSS

.upline {
	z-index: 1100;
	position: absolute;
	background-color: green;
  width: 300px;
  height: 100px
}
.parentline {
	background-color: blue;
  width: 300px;
    height: 200px
}