JSFiddle - React, Tailwind, and code Playground

HTML

<header>1</header>
  <main>
	<aside>2</aside>
	<section class="content">adsadsadsadsakfd sajkddhsajkdh ksa djksah d3</section>
  </main>
	<footer>
		<textarea class="groesse" name="text"></textarea>
	</footer>

CSS

html, body {height:100%;} 

*{margin:0;}

body {display:flex; flex-direction:column; background:#c0c0c0; width:100%;} 
header {background:#ff0000; height:50px; flex: 0 0 50px}  
footer {background:#ff0000; height:50px; flex: 0 0 50px }  
main { display:flex; flex-direction:row; flex: 1}
aside { flex: 0 0 20%;background:#006600;}
.content { flex: 1; background:#00eeee;}

.groesse {resize: vertical;}