JSFiddle - React, Tailwind, and code Playground

HTML

<body>
	<div id="main">
		<section id="a">Test1</section
    <section id="a">Test1</section>
		<section id="b">Test2</section>
	</div>
</body>

CSS

#a {
	flex: 1 0 auto;
}
#b {
	flex: 0 0 auto;
	min-height: 3em;
    background-color: yellow;
    line-height: 3em;
}
#a {
    background-color: blue
}
#main {
	display: flex;
	flex-direction: column;
	height: inherit;
}

body {height: inherit;}html {height: 100%;}