JSFiddle - React, Tailwind, and code Playground

HTML

<div id="zwrapper">
    <div id="z1" class="row"></div>
    <div id="z2" class="row"></div>
    <div id="z3" class="row"></div>
</div>

CSS

html{
	background: steelblue;
	background-size: cover;
	height: 100%;
	width: 100%;
	top:0;
	left:0;
	bottom: 0;
	right:0;
}
#zwrapper{
	height: 81%;
	top: 10%;
	width: 100%;
	left: 0;
	position: absolute;
	background: lime;
}
.row{
	position: relative;
	width: 80%;
	background: red;
	height: 30%;
}
#z2{
	margin: 5% 0;
}