Created by: lipis
This approach is much cleaner, smaller and simpler to understand and it works with IE8+, Chrome, Safari, Firefox, Opera!
Here are the example in action without any #wrap
divs:
sticky-footer-navbar
sticky-footer
That's the new CSS for sticky footers without the #wrap
looks like this:
html {
position: relative;
min-height: 100%;
}
body {
/* Margin bottom by footer height */
margin-bottom: 60px;
}
#footer {
position: absolute;
bottom: 0;
width: 100%;
/* Set the fixed height of the footer here */
height: 60px;
background-color: #f5f5f5;
}
This solution was found here: http://mystrd.at/modern-clean-css-sticky-footer/ and of course all the credit goes there!