JSFiddle - React, Tailwind, and code Playground

by Neo Aptt

HTML

<div class="bumper"></div>
<div id="content">
    <div id="huvud">
        <img id="header" src="hej.jpg" alt="Header">
    </div>
    <div id="nav-yttre">
        <div id="nav-mitten">
            <ul id="nav-inre">
                <li><a href="index.html">HEM</a>
                </li>
                <li><a href="om_oss.html">OM OSS</a>
                </li>
                <li><a href="blogg.html">BLOGG</a>
                </li>
                <li><a href="marken.html">M&Auml;RKEN</a>
                </li>
                <li><a href="hitta_hit.html">HITTA HIT</a>
                </li>
            </ul>
        </div>
    </div>
    <div id="main">
        <div id="fadein">
            <img src="slides1.jpg">
            <img src="slides2.jpg">
            <img src="slides3.jpg">
        </div>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam tempus quam lectus, in suscipit nisl luctus feugiat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent elit eros, tempor sed bibendum nec, luctus in dui. Proin vitae tincidunt diam, a pulvinar tortor. Maecenas pulvinar rhoncus nisl quis aliquet. Nulla dolor metus, euismod ac gravida eget, congue at nunc. Etiam non urna vel dolor pulvinar finibus. Suspendisse eget lacinia massa. Morbi sodales non purus pretium congue. Nullam sed tellus diam. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nulla porta sapien sit amet placerat lobortis. Nunc sed orci tincidunt, lacinia massa ut, fringilla est. Maecenas sodales orci at erat malesuada, non tristique leo auctor. Suspendisse augue felis, lobortis rhoncus pharetra at, pretium sit amet dolor.</p>
    </div>
    <div id="fot">
        <div id="fot-inre">
            <div id="adress">
                <p id="rub">BES&Ouml;KSADRESS</p>
                <p>Hej</p>
            </div>
            <div id="kontakt">
                <p id="rub">KONTAKTA OSS</p>
                <p>Telefon: 08-123 45...

CSS

html, body {
    background: grey;
    height: 100%;
    margin:0px; //important
}
.bumper {
    height:5px;
    width:100%;
}
#content {
    background-color: white;
    max-width:1100px;
    padding: 5px;
    min-height:90%; //backup for browsers who do not support calc
    min-height:calc(100% -5px);
    margin-left: auto;
    margin-right: auto;
    border-radius: 5px;
}