Many times the webpage footer comes up due to no or less content on the webpage. We can resolve that with the help of Bootstrap CSS this is also known as Sticky Footer. This CSS will make sure that the footer will remain at the bottom of the screen what ever the screen size is.

Note:- I faced a problem while implementing it and it was due to the height property in the footer class and margin-bottom in body. First check what height is of your footer and give the same in both places.

CSS

    html {
      position: relative;
      min-height: 100%;
    }
    body {
      / Margin bottom by footer height /
      margin-bottom: 122px;
    }
    .footer {
      position: absolute;
      bottom: 0;
      width: 100%;
      height:112px;
      / Set the fixed height of the footer here */
      height: 60px;
      background-color: #f5f5f5;
    }