JSFiddle - React, Tailwind, and code Playground

by Max Hung

HTML

<body>
    <div class="wrap">
        <div class="innerWrap">
             <h1 class="mainTitle">someTitle</h1>

        </div>
        <div class="footer"></div>
    </div>
</body>

CSS

* {
    margin: 0;
}
html, body, .wrap {
    height: 100%;
}
.innerWrap {
    min-height: 100%;
    margin-bottom: -200px;
}
.footer {
    background-color: orange;
    height: 200px;
}

JavaScript

windowHeight = $(window).height();
footerHeight = $(".footer").height();

$(".wrap").css({
    "height": windowHeight + footerHeight
});