Sticky Footer – Making footer aligned to bottom of screen

  • sydneywebsites

    (@sydneywebsites)


    13 years, 2 months ago

    Hey everyone,

    I am having a big issue with the footer on my website: http://germanlessons.com.au/about/

    As you can see the footer isn’t aligned with the bottom of the page, but is rather floating below the main page content. I have tried heaps of forums and different methods to get it aligned to the bottom of the page, but nothing seems to be working.

    I have tried using min-height: 100%, height:100%, vertical-align:baseline/bottom and clear:both throughout the CSS, but nothing seems to want to push the footer down. However if I apply a margin-bottom to the main page content that will push down the footer, but I can never get it aligned properly. Please help, any ideas would be greatly appreciated!

Viewing 3 replies - 1 through 3 (of 3 total)
  • George

    (@georgegecewicz)

    13 years, 2 months ago

    The code from http://www.cssstickyfooter.com/ works great, try that and see if it works 🙂

    Thread Starter sydneywebsites

    (@sydneywebsites)

    13 years, 2 months ago

    Hi George,

    I appreciate your help, I have tried that code already and it still doesn’t work. If you use firebug and apply that code it still remains the same.

    Is it possible a non-CSS element might be causing this, or anything else in my code like javascript? mmmm

    George

    (@georgegecewicz)

    13 years, 2 months ago

    Hmmm…it’s hard to tell as I’m just viewing from the outside view via firebug. Since there’s essentially two footer divs, a wrapper and in an “inner”, have you tried targeting the sticky footer CSS to both elements?

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Sticky Footer – Making footer aligned to bottom of screen’ is closed to new replies.