JSFiddle - React, Tailwind, and code Playground

by Inigo

HTML

<div id="wrapper">

<div id="header"></div>

<div id="container">
	<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc quis laoreet lectus. Morbi eleifend id massa sit amet aliquam. Sed facilisis diam eros, sed iaculis odio pulvinar et. Sed est elit, tristique in rutrum ac, tempor at ipsum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec posuere nisi eget facilisis ultrices. Nunc non dui felis. Morbi pharetra congue turpis et luctus. Nullam nunc diam, bibendum sit amet dui quis, eleifend auctor ante.</p>
</div>

<div id="footer"></div>

</div>

CSS

#wrapper {
	position:absolute;
	top:0px;
	min-height:100%;
	left:50%;
	margin-left:-615px;
	width:930px;
	overflow:hidden;
	background-color:#CCCCCC;
}
#header {
	height:200px;
	width:930px;
	background-color:#ce41a8;
}
#container {
	width:840px;
	padding:45px;
	background-color:#41ce41;
}
#footer {
	position:absolute;
	bottom:0px;
	left:0px;
	height:60px;
	width:100%;
	background-color:#4259e5;
}