JSFiddle - React, Tailwind, and code Playground
HTML
<header id="header">
<img src="//placehold.it/220x79" alt="" border="0" width="" height="">
<div class="innertube">
</div>
</header>
<div id="wrapper">
<main>
<div id="content">
<div class="innertube">
<br clear="all"/>
Bitte klicken Sie auf die Kategorie, die Sie interessiert: <br>
<br>
<a href="gallerie.html"><img src="//placehold.it/171x33" alt="" border="0" width="171" height="33"></a>
<a href="gallerie_b.html"><img src="//placehold.it/171x33" alt="" border="0" width="171" height="33"></a>
<a href="gallerie_c.html"><img src="//placehold.it/171x33" alt="" border="0" width="171" height="33"></a>
<a href="gallerie_u25.html"><img src="//placehold.it/171x33" alt="" border="0" width="171" height="33"></a>
<br><br>
<a href="gallerie.html"><img src="//placehold.it/171x33" alt="" border="0" width="171" height="33"></a>
<a href="gallerie_b.html"><img src="//placehold.it/171x33" alt="" border="0" width="171" height="33"></a>
<a href="gallerie_c.html"><img src="//placehold.it/171x33" alt="" border="0" width="171" height="33"></a>
<a href="gallerie_u25.html"><img src="//placehold.it/171x33" alt="" border="0" width="171" height="33"></a>
<br><br>
...
CSS
body {
margin:0;
padding:0;
font-family: Sans-Serif;
line-height: 1.5em;
}
#header {
background: #2c2c2c;
height: 79px;
}
#header h1 {
margin: 0;
padding-top: 15px;
}
main {
padding-bottom: 10010px;
margin-bottom: -10000px;
float: left;
background: #72b2d7;
width: 100%;
}
#nav {
padding-bottom: 10010px;
margin-bottom: -10000px;
float: left;
width: 220px;
margin-left: -100%;
background: #2c2c2c;
}
#footer {
clear: left;
width: 100%;
background: #2c2c2c;
text-align: left;
padding: 7px 0;
padding-left:219px;
}
#wrapper {
overflow: hidden;
}
#content {
margin-left: 230px; /* Same as 'nav' width */
}
.innertube {
margin: 15px; /* Padding for content */
margin-top: 0;
...