JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://code.jquery.com/jquery-3.4.1.js"></script>
<body>
<header>
<div class="loginBlock">
<p>
Login Here
</p>
</div>
</header>
<footer>
<p class="loginfooter">
Footer Text
</p>
</footer>
</body>
CSS
footer {
width: 100%;
}
body{
margin: 0;
padding: 0;
}
.loginfooter {
background: #4d4d4d;
padding: 18px 0 15px 0;
color: #3C3C3E;
font-family: Arial;
font-size: 14px;
font-weight: bold;
text-align: center;
margin: 0;
}
JavaScript
$(document).ready(function() {
function pageheight() {
debugger
var ContainerMinHeight = ($(window).height()) - (($("header").height()) + ($("footer").height() + 27));
$("body").css("min-height", ContainerMinHeight);
}
pageheight();
});