JSFiddle - React, Tailwind, and code Playground

by techsin

HTML

<div id="wrapper">
    <div id="header"></div>
    <div id="content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Provident dicta voluptates molestias quia facilis veniam saepe porro cupiditate ipsa exercitationem adipisci quos incidunt debitis consectetur ipsam quo omnis. Expedita officiis.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Molestias explicabo blanditiis magnam dolore quasi doloribus ab distinctio vitae dicta doloremque provident dignissimos ex magni perspiciatis inventore assumenda quos veniam reiciendis.</div>
    <div id="footer"></div>
</div>

CSS

html, body {
    margin:0;
    padding:0;
    height:100%;
}
#wrapper {
    min-height:100%;
    position:relative;
}
#header {
    padding:10px;
    background:#5ee;
}
#content {
    padding:10px;
    padding-bottom:80px;
    /* Height of the footer element */
}
#footer {
    width:100%;
    height:80px;
    position:absolute;
    bottom:0;
    left:0;
    background:#ee5;
}