JSFiddle - React, Tailwind, and code Playground
HTML
<div id = "app">
<div id = "container">
<div id = "header">Header</div>
<main id ="main-container">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas aliquam leo ac ex semper dignissim quis vitae mauris. Ut ultricies elit ut nunc finibus interdum. Mauris ut pulvinar enim, id aliquet tellus. Aenean sed odio euismod, auctor orci rutrum, lobortis urna. Pellentesque et accumsan est. Quisque interdum condimentum quam dignissim molestie. Duis volutpat lorem eu ipsum aliquet, sed luctus orci malesuada. Nulla facilisi. Quisque ultrices, libero ac elementum mattis, lacus ligula lacinia justo, at imperdiet sem augue a neque. Donec sed nisl lacus. Nam quis urna ac nisl luctus congue. Suspendisse efficitur justo eu urna lacinia, in euismod augue fermentum. Pellentesque facilisis tortor ligula, ac convallis leo blandit eu. Donec malesuada nunc in felis aliquam accumsan.
In ac mi metus. Nam volutpat nec lacus in interdum. Proin tincidunt id erat eget lobortis. Nulla odio nisi, elementum vel metus quis, gravida pellentesque turpis. Aliquam pretium diam ut dapibus vestibulum. Integer maximus vulputate dapibus. Nam id porta dui. Aliquam vel dictum odio, eget elementum magna. Aliquam ut lacus a diam convallis porttitor. Maecenas eleifend non lorem tincidunt interdum. Sed id nisl sem.
Nullam eu suscipit dui. Praesent rhoncus augue arcu, ut pharetra tortor blandit nec. Vestibulum imperdiet, velit interdum ultricies accumsan, odio purus dictum urna, non rutrum augue nulla quis turpis. Aliquam congue pretium purus, accumsan euismod risus efficitur a. Phasellus dapibus bibendum libero, ut laoreet tortor euismod quis. Suspendisse tempus sit amet velit eu consequat. Curabitur blandit ante a nulla ultricies, eget ornare velit placerat. Aliquam at venenatis dui. Nulla ornare, neque quis cursus consectetur, turpis mauris auctor enim, eu bibendum tellus odio eget augue.
Donec suscipit ornare molestie. Aenean fermentum, elit nec tempus faucibus,...
CSS
#header {
background-color: blue;
}
#footer {
background-color: red;
}
#container {
background-color: #2E3243;
display: flex;
flex-direction: column;
height: 100vh;
min-height: 100vh;
color: white;
min-width: 100vw;
}
#main-container {
display: flex;
flex: 1 1 0%;
padding-left: 2rem;
padding-right: 2rem;
padding-top: 1.25rem;
padding-bottom: 1.25rem;
justify-content: center;
}