WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] White space under footer (18 posts)

  1. ninjaninja
    Member
    Posted 1 year ago #

    Hi,

    At the bottom of some pages there is a white space beneath the footer - http://ninjaninja.co.uk/category/hacking/ - how can i get rid of this?

    Its fine on other pages, such as the home page, it just seems to be on pages that have fewer posts on them

    http://ninjaninja.co.uk/

    Thanks

  2. Andrew
    Forum Moderator
    Posted 1 year ago #

    Which browser & browser version is the problem occurring in?

  3. ninjaninja
    Member
    Posted 1 year ago #

    Hi

    Chrome 23.0.1271.95 m and IE9

  4. Andrew
    Forum Moderator
    Posted 1 year ago #

    Sorry, I can't replicate the issue in neither browser.

  5. ninjaninja
    Member
    Posted 1 year ago #

    strange, are you on a laptop screen?

    It only happens on pages where the content doesnt fill the whole page

  6. Andrew
    Forum Moderator
    Posted 1 year ago #

    Yes, if I zoom out, your footer does not stay at the bottom. Are you trying to achieve a footer that sticks to the bottom of the window? If so, consider this tutorial http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page

  7. ninjaninja
    Member
    Posted 1 year ago #

    Hi,

    Sadly that didnt work - or i dont understand how i can apply that code to my blog

    any more thoughts?

    Thanks

  8. invot
    Member
    Posted 1 year ago #

    The issue is with your CSS (line 265)

    .FooterBG {
        width: 100%;
        float: left;
        background: none repeat scroll 0% 0% rgb(0, 0, 102);
        padding: 25px 0px;
        position: absolute;
        bottom: 0; // this will fix the bar to the bottom of the page
    }
  9. ninjaninja
    Member
    Posted 1 year ago #

    Hi,

    Thanks for your help but the footer is now in the middle of the page when i scroll down

    it should be underneath all of the content

    Thanks

  10. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Absolute positioning is the problem. It puts the footer at the bottom of the window -- NO MATTER where that is on the page.

  11. ninjaninja
    Member
    Posted 1 year ago #

    ok, thanks

    is there another way to position the footer instead of using position: absolute;?

    Thanks

  12. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Yes, try changing the above to:

    .FooterBG {
        width: 100%;
        float: left;
        background: none repeat scroll 0% 0% rgb(0, 0, 102);
        padding: 25px 0px;
        margin-top: 20px;
    }

    Adjust the margin so it's below the other elements.

  13. ninjaninja
    Member
    Posted 1 year ago #

    Thanks, its positioned at the bottom of my site now but there is still a white gap below the footer.

  14. ninjaninja
    Member
    Posted 1 year ago #

    FIXED!

    I added margin-bottom: -20px to your code and its sorted now

    Thanks for all of your help

  15. Andrew
    Forum Moderator
    Posted 1 year ago #

    Ninja, what happens when someone visits the website on a larger (taller) screen?

  16. ninjaninja
    Member
    Posted 1 year ago #

    ah.....exactly the same thing

    damn.

    Any thoughts Andrew?

  17. Andrew
    Forum Moderator
    Posted 1 year ago #

    I followed that tutorial in my 3rd post and achieved this http://awesomescreenshot.com/04dpatz1b

    Perhaps you were missing a few styles when you attempted?

  18. ninjaninja
    Member
    Posted 1 year ago #

    i had missed out the #body CSS

    Thats it fixed now

    Thanks for all of your help

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.