SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Enthusiast tide's Avatar
    Join Date
    Mar 2005
    Location
    Hawaii
    Posts
    46
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    sticky footer doesn't stick

    I'm trying to design the footer on this page to stick to the bottom of the browser window, without covering up any content when the window gets smaller. I can't seem to get it to work.

    Any suggestions?

    Here's a link to my webpage and css.

    http://equinox-landscape.com/beta/sticky.html

    http://equinox-landscape.com/beta/sticky.css

    I used this technique - New CSS Sticky Footer - 2010 - HTML for Bottom of Page Footer

    I'm willing to abandon this code and try something else if necessary.

    Any help would be much appreciated.

  2. #2
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,656
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)

  3. #3
    SitePoint Enthusiast tide's Avatar
    Join Date
    Mar 2005
    Location
    Hawaii
    Posts
    46
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I had one little detail wrong. The footer was inside the wrap.

    Thanks for your help.

  4. #4
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,656
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    After viewing your source code from my iPhone (yes!) it looks like you have the footer insid the wrapper. It is supposed to be outside your wrapper. Also, probably better to pu any padding on the inner elements rather than the footer.

  5. #5
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,355
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    You don't seem to be using the up to date current code for the sticky footer anyway and that means you will have problems in IE and opera. See the css faq (link in my sig) as it contains all the code you need for modern browsers.


Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •