JSFiddle - React, Tailwind, and code Playground

HTML

<body>
	  <div class="main-container">
	     <div class="main-header">
	       HEADER
	     </div>
	     <div class="main-content">
	      
	        jecechejbhcbjbcjrbjb bbjbhbbk

	     </div>
	     <div class="main-footer">
	       FOOTER
	     </div>
	  </div>
	</body>

CSS

@CHARSET "ISO-8859-1";
body,html{
	width:100%;
  margin: 0;
  padding: 0;
	height:100%;
	//font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-family:"Trebuchet MS !important";
  background-color:#00b3b3;
}
.main-container{
	display:flex;
	flex-direction:column;
	
	flex-wrap:nowrap;
	height:100%;
  width:100%;
  box-sizing:border-box;
}
.main-header{
	background-color:#099;
	height:10%;
}
.main-footer{
	background-color:#099;
	height:10%;
}
.main-content{
	background-color:#fff;
	height:100%;
}