JSFiddle - React, Tailwind, and code Playground

HTML

<div class="yellow">
	<div class="green">
	</div>
	<div class="red">
	</div>
</div>

CSS

.green, .red{
	height: 100px;
}
.yellow{
	background-color: yellow;
	width: 1000px;
	margin: auto;
	height: 100%;
}
.green{
	background-color: green;
	margin-left: 230px;
	margin-right: -200%;
}
.red{
	background-color: red;
	margin-left: -200%;
	margin-right: 460px;
}
body{
	overflow: hidden;
}