JSFiddle - React, Tailwind, and code Playground
HTML
<div id="container">
<div id="top"><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cumque nam quaerat iste assumenda sed eius sapiente illo quae doloribus minus. Excepturi qui tempore cupiditate, incidunt enim alias recusandae dolores quidem, possimus voluptates, voluptatum magnam? Officiis iure nam laudantium similique earum quia, eaque dicta perspiciatis odit. Minus vero quaerat, facilis cum quis eius fugit voluptates assumenda iste eaque ducimus, laborum obcaecati repellat iusto porro dolore commodi inventore. Libero ex aspernatur explicabo aut excepturi dolorum fugit suscipit ipsam tenetur? Labore eligendi quos assumenda mollitia nisi porro non, veniam, fugit rem dicta cupiditate optio libero a excepturi. Ut nostrum neque temporibus quod animi dolores beatae inventore amet magni voluptates suscipit, minima non expedita quae eius veniam dolorum. Reiciendis libero, ex mollitia quo odit repudiandae molestias beatae accusamus, minima amet consequatur iusto velit temporibus incidunt est, delectus non molestiae sit quam ea corrupti maxime fugit! Natus ipsam obcaecati nostrum asperiores at, sapiente delectus eveniet optio et similique debitis animi, nobis repudiandae voluptas dicta reiciendis sequi maiores! Ducimus doloremque numquam corporis! Fugit eaque qui, sapiente obcaecati, aperiam quasi, atque placeat quia debitis, sit tempore. Dolorum accusantium officiis nam nostrum iusto corporis temporibus similique velit, doloribus quia ea odit quidem labore totam, animi, ratione blanditiis consequatur repellat. Maiores saepe fugiat alias? Perspiciatis cum ipsa molestias id cupiditate suscipit ex ad architecto adipisci beatae nulla harum doloremque expedita veritatis saepe et repudiandae, eaque quasi velit, fugit eum tempore mollitia! Voluptatibus ea nostrum quos voluptas sed minus quo quia asperiores similique atque et, eaque architecto hic quod quibusdam.</p></div>
<div id="bottom"></div>
</div>
CSS
* {
margin: 0;
padding: 0;
}
html, body {
height: 100%;
}
#container {
height: 100%;
display: flex;
flex-direction: column;
}
#top {
background-color: lightgreen;
}
#bottom {
background-color: lightblue;
flex:1;
}