JSFiddle - React, Tailwind, and code Playground
HTML
<div class="header"></div>
<div class="wrapper">
<div class="content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus pulvinar ultricies elit, ut mattis nibh blandit laoreet. Maecenas malesuada auctor leo, ac fringilla elit pellentesque ut. Mauris sed magna ut massa congue dignissim eget non lectus. In posuere bibendum augue, sit amet consequat eros porttitor non. Fusce turpis eros, lobortis id ultrices eu, semper ut arcu. Donec pharetra purus sit amet libero eleifend consectetur scelerisque massa rutrum. Curabitur sit amet augue in nibh sagittis sodales. Ut consequat lobortis quam, ut porta purus consectetur a.
</div>
<div class="footer"></div>
</div>
CSS
div {width: 300px;}
.header {
height: 20px;
background: grey;
}
.wrapper {position: relative;}
.content {
position: relative;
z-index: 10;
text-align: justify
}
.footer {
position: absolute;
bottom: 0;
background: red;
height: 50px;
}