JSFiddle - React, Tailwind, and code Playground
HTML
<div class="container">
<div class="content">
<div class="content__inside">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores natus facere quam illum sint suscipit modi dolores, possimus quis esse itaque. Quo dolores repellendus id odit consequatur voluptas dignissimos molestias!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores natus facere quam illum sint suscipit modi dolores, possimus quis esse itaque. Quo dolores repellendus id odit consequatur voluptas dignissimos molestias!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores natus facere quam illum sint suscipit modi dolores, possimus quis esse itaque. Quo dolores repellendus id odit consequatur voluptas dignissimos molestias!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores natus facere quam illum sint suscipit modi dolores, possimus quis esse itaque. Quo dolores repellendus id odit consequatur voluptas dignissimos molestias!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores natus facere quam illum sint suscipit modi dolores, possimus quis esse itaque. Quo dolores repellendus id odit consequatur voluptas dignissimos molestias!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores natus facere quam illum sint suscipit modi dolores, possimus quis esse itaque. Quo dolores repellendus id odit consequatur voluptas dignissimos molestias!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores natus facere quam illum sint suscipit modi dolores, possimus quis esse itaque. Quo dolores repellendus id odit consequatur voluptas dignissimos molestias!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores natus facere quam illum sint suscipit modi dolores, possimus quis esse itaque. Quo dolores repellendus id odit consequatur voluptas dignissimos molestias!</p>
<p>Lorem...
CSS
html,
body {
width: 100%;
height: 100%;
padding: 0;
margin: 0;
}
body {
background: #fff;
}
.container {
display: flex;
flex-direction: column;
background: brown;
flex: 1 0 auto;
height: 100%;
}
.content {
display: flex;
flex: 1 0 auto;
}
.content__inside {
background: blue;
overflow-y: auto;
}
.footer {
background: yellow;
padding: 5px;
}