JSFiddle - React, Tailwind, and code Playground

HTML

<html>
    <body>
        <div id="contentcontainer">
            <div id="green-line">
            </div>
            <div class="center-box">
                Content goes here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <br/>and here
                <div class="push"></div>
            </div>
            <div id="greenfooter">
                <div style="min-height: 7px; background-color: #EDEDED; background-color: whitesmoke;">
                </div>
                <div>
                    Footer here
                </div>
            </div>
        </div>
    </body>
</html>

CSS

* {
margin: 0;
}

html, body
{
    font-family: Arial, helvetica, Calibri, 'Arial Unicode MS';
    padding: 0;
    margin: 0;
    background-color: whitesmoke;
    height: 100%;
}


#contentcontainer
{
    /*padding-bottom: 237px;   /* Height of the footer element */
    background-color: lightblue;
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -237px;
}


#green-line
{
    height: 5px;
    background-color: #b8d30b;
}

.center-box
{
    width: 90%;
    margin: auto;
    padding-left: 20px;
}

#greenfooter, .push
{
     min-height: 237px;
}

#greenfooter
{
  background-color:red;
    /*
width: 100%;
height:237px;
position: fixed;
bottom:0px;*/
}

#greenfooter, .push {
clear: both;
}

form {
    height: 100%;
}