JSFiddle - React, Tailwind, and code Playground

HTML

<body>
		<div id="container">
			<div id="header">
				<p>Header</p>
			</div>
			<div id="subcontainer">
				<div id="fixedcolumns">
					<div id="fixedmenu">
						<p>Menu</p>
						<p>Menu</p>
					</div>
					<div id="fixedbody">
						<p>Cuerpo</p>
					</div>
				</div>
			</div>
			<div id="footer">
				<p>Footer</p>
			</div>
		</div>
	</body>

CSS

* {
	margin-top: 0;
	margin-bottom:0;
}

html, body {
	height: 100%;
	margin: 0;
	padding: 0;
	background-color: rgb(216, 218, 234);
}

#container {
	width: 80%;
	min-height: 100%;
	height: 100%;
	margin-left: 10%;
	margin-right: 10%;
	background-color: rgb(255, 255, 204);
}

#header {
	min-height:120px;
	height: 19%;
	width: 100%;
	background-color: #CCC;
	clear: both;
	float: left;
}

#subcontainer {
	clear: both;
	min-height: 77%;
	height: auto !important;
	height: 100%;
	background-color: rgb(255, 255, 204);
	position: relative;
}

#footer {
	clear:both;
	width: 100%;
	height:4%;
	background: #007F0E;
}

#fixedcolumns {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

#fixedmenu {
	float: left;
	width: 15%;
	min-height: 100%;
	height: 100%;
	background: #088316;
	background: -webkit-gradient(linear, 0 0, 0 bottom, from(#088316), to(#FFFFFF));
	background: -webkit-linear-gradient(#088316, #FFFFFF);
	background: -moz-linear-gradient(#088316, #FFFFFF);
	background: -ms-linear-gradient(#088316, #FFFFFF);
	background: -o-linear-gradient(#088316, #FFFFFF);
	background: linear-gradient(#088316, #FFFFFF);
	-pie-background: linear-gradient(#088316, #FFFFFF);
	behavior: url(/pie/PIE.htc);
}

#fixedbody {
	float: left;
	width: 85%;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	background-color: #DDF;
}