JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
	<head>
		<title>E-Health</title>
	</head>
	<body>
		<div id="wrapper">
			<header>
				<h1>E-Health</h1>
			</header>
			<nav>
				<ul>
					<li><a href="https://de.wikipedia.org/wiki/Medizinische_Informatik" target="_blank">Medizinische Informatik</a></li>
					<li><a href="https://de.wikipedia.org/wiki/Telemedizin" target="_blank">Telemedizin</a></li>
					<li><a href="https://de.wikipedia.org/wiki/Elektronische_Patientenakte" target="_blank">elektronische Patientenakten</a></li>
					<li><a href="https://de.wikipedia.org/wiki/Elektronische_Gesundheitskarte" target="_blank">elektronische Gesundheitskarte</a></li>
					<li><a href="https://de.wikipedia.org/wiki/E-Appointment" target="_blank">E-Appointment</a></li>
					<li><a href="https://de.wikipedia.org/wiki/E-Mental-Health" target="_blank">E-Mental-Health</a></li>
				</ul>
			</nav>
			<main>
				<article>
					<section>
						<h2>Definition <em>E-Health</em></h2>
						<p>
							Bis zur Jahrtausendwende wurde mit <strong>E-Health</strong> noch vorwiegend die Digitalisierung traditioneller 
							Prozesse im öffentlichen Gesundheitswesens wie elektronische Gesundheitsakten oder ein elektronisch 
							gestütztes Krankheits- und Wissensmanagement bezeichnet.
						</p>
						<p>
							Aufgrund neuer technologischer Entwicklungen wie mobiles Internet oder Internet der Dinge entwickelten 
							sich seitdem eine Vielzahl weiterer ICT-gestützter Anwendungen für das Gesundheitswesen. Dies führte 
							zu einer allgemeineren Fassung der E-Health-Definition, die heute als Oberbegriff für eine Vielzahl von Bereichen dient.
						</p>
						<p>
							Die Disziplinen Medizin, IT und Gesundheitsmanagement werden dabei zu dem neuen Fachbereich E-Health verschmolzen.
						</p>
					</section>
					<section>
						<h3>Herkunft des Begriffs</h3>
						<p>
							Als Sammelbegriff für das Zusammentreffen von Internet und Medizin tauchte E-Health 
							im Zuge des dotcom-Booms zuerst 1997...

CSS

header { background-color: red; }
nav { background-color: yellowgreen; }
main { background-color: yellow2; }
article { background-color: orange; padding: 5px; }
section { background-color: tan; }
aside { background-color: magenta; padding: 5px; }
footer { background-color: cyan; }
main { display: flex; }
#wrapper { margin: auto; width: 80%; }

#wrapper { 
  display: flex; 
  flex-wrap: wrap;
}
header { flex: 1 1 100%; }
nav { flex: 1; }
main { flex: 3; }
footer { flex: 1 1 100%; }