JSFiddle - React, Tailwind, and code Playground

HTML

<div id="header">

<ul>

<li><a rel="nofollow" href="#">Home</a></li>

<li><a rel="nofollow" href="#">About me</a></li>

<li><a rel="nofollow" href="#">Contact</a></li> <li>

<a rel="nofollow" href="#">Login</a></li> <li>

<a rel="nofollow" href="#">Registration</a></li> </ul> </div>

<div id="slide-show">

</div>

<div id="footer">
Štruktúra vyzerá nejako takto
</div>

CSS

html { position: relative; min-height: 100%; }

body { margin-bottom: 60px; }

#header { width: 100%; height: 60px; background-color: #333; border-radius: 5px; }

ul { width: 100%; height: 60px; list-style: none; text-align: center; }

li { display: inline-block; }

li a { text-decoration: none; color: white; text-align: center; }

.footer { position: absolute;

 bottom: 0;

width: 100%; 

height: 60px;

line-height: 60px;

background-color: #333;

text-align: center;

border-radius: 5px;

color: grey; }