how to fix the footer at the bottom of the page
#footer {
position:fixed;
left:0px;
bottom:0px;
z-index:1;
width:100%;
}
how to fix the footer at the bottom of the page
#footer {
position:fixed;
left:0px;
bottom:0px;
z-index:1;
width:100%;
}
push footer to bottom
.flex-wrapper {
display: flex;
min-height: 100vh;
flex-direction: column;
justify-content: space-between
}
keep footer at bottom of page
#footer {
position: relative;
margin-top: -180px;
/* negative value of footer height */
height: 180px;
clear: both;
/*Custom styling*/
}
/* Opera Fix thanks to Maleika (Kohoutec) */
body:before {
content: "";
height: 100%;
float: left;
width: 0;
margin-top: -32767px;
/* thank you Erik J - negate effect of float*/
}
footer at bottom of body
html, body {
height: 100%;
}
body {
display: flex;
flex-direction: column;
}
.content {
flex: 1 0 auto;
}
.footer {
flex-shrink: 0;
}
footer bottom
<script>
$(document).ready(function() {
setInterval(function() {
var docHeight = $(window).height();
var footerHeight = $('#footer').height();
var footerTop = $('#footer').position().top + footerHeight;
var marginTop = (docHeight - footerTop + 10);
if (footerTop < docHeight)
$('#footer').css('margin-top', marginTop + 'px'); // padding of 30 on footer
else
$('#footer').css('margin-top', '0px');
// console.log("docheight: " + docHeight + "n" + "footerheight: " + footerHeight + "n" + "footertop: " + footerTop + "n" + "new docheight: " + $(window).height() + "n" + "margintop: " + marginTop);
}, 250);
});
</script>
Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us