Fix footer to bottom if no vertical scrollbar

If you need a footer to stick to the bottom when there is no vertical scrollbar, do the following:


$(document).ready(function() { 
  if($("body").height() <= $(window).height()){ 
    $(".footer-container").css("bottom", 0);
    $(".footer-container").css("position", "absolute");
    $(".footer-container").css("width","100%");
  }
});

 

This will ensure the footer sticks to the bottom of the browser when there is no scrollbar (eliminating the weird empty space that can some times happen under the footer), while keeping the footer at the very bottom of the body whenever scrolling is needed (so that it doesn’t stick out and take up valuable screen space).

Leave a Reply

Your email address will not be published. Required fields are marked *