WordPress.org

Ready to get started?Download WordPress

Forums

Problems with sticky footer (2 posts)

  1. sugarMonsterx
    Member
    Posted 1 year ago #

    I'm trying to get my footer to stick to the bottom of my page. I've followed loads of different tutorials (most of them very similar) on sticky footers, but none of them have worked for me. For some reason the footer positions itself at the bottom of the browser window instead of the actual page...

    This is the layout of divs in my HTML:

    <div id="wrapper">
    <div id="header"></div>
    <div id="main"></div>
    <div id="footer"></div>
    </div>

    This is my CSS:

    html, body {
    height: 100%;
    
    #wrapper {
    min-height: 100%;
    position: relative;
    }
    
    #content {
    position: absolute;
    padding-bottom: 300px; (same as footer height)
    }
    
    #footer {
    width: 100%;
    height: 300px;
    position: absolute;
    bottom: 0px;
    }
  2. Keith Burgie
    Member
    Posted 1 year ago #

    Could you post a link to your site?

    Could you post another link to a site or tutorial with the footer you're trying to get?

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.