Search code examples
csssticky-footer

CSS: Sticky footer not working


If you compare the following 2 pages:

Page 1: http://goldencraft.co/wp/

Page 2: http://goldencraft.co/wp/contact/

CSS: http://goldencraft.co/wp/wp-content/themes/minecraft/style.css

You'll see that when there is content, the footer isn't properly sticking. I have been trying to fix it for an hour, so I'm hoping someone can spot the problem inside the CSS, thanks.

Example of sticky footer


Solution

  • The culprit appears to be the iframe right before the </body> tag. It has a visibility:hidden rule, which will allow it to displace elements on the page (in comparison to display:none).

    You can either remove it, or add the following css:

    iframe {
      display:none;
    }