Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Senior Coder twodayslate's Avatar
    Join Date
    Mar 2007
    Location
    VA
    Posts
    1,042
    Thanks
    67
    Thanked 39 Times in 39 Posts

    Sticky footer with content

    Sticky footer (http://ryanfait.com/sticky-footer/) but with the content following it. The footer is behind the content - 100%ish height.

    Code:
     ####### header
     |     |
     |     | content
     |     |
    -|-----|- footer (content is #px over footer)
    This is useful for what you have a crazy footer background but don't want to loose content space.

    Any ideas on how to do this without javascript? Also, do not want to make the footer have an extra image to make it look like a content area.

    Ideas?

    URL: http://cosmz.com/test.html
    Last edited by twodayslate; 04-02-2009 at 05:04 AM.
    twitter | Quality Hosting - $5.95/mo*
    Feel free to PM me!

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,855
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    This is useful for what you have a crazy footer background but don't want to loose content space.

    Any ideas on how to do this without javascript? Also, do not want to make the footer have an extra image to make it look like a content area.
    Your intention/issue is not perfectly clear, though have you checked http://www.bonrouge.com/2c-hf-fixed.php?nc (which uses a slightly different approach than your original reference)?
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    Senior Coder twodayslate's Avatar
    Join Date
    Mar 2007
    Location
    VA
    Posts
    1,042
    Thanks
    67
    Thanked 39 Times in 39 Posts
    Quote Originally Posted by abduraooft View Post
    Your intention/issue is not perfectly clear, though have you checked http://www.bonrouge.com/2c-hf-fixed.php?nc (which uses a slightly different approach than your original reference)?
    bon uses an extra background image. the content does not truly stretch - the wrapper does. will try to make it work but i doubt it...

    edit://here is why I think the wrapper background method will not work: the content is above the header image and the background image. if you made the container have a bg then it would cover up the header and footers?
    plus in this case: curved corners.
    Last edited by twodayslate; 04-02-2009 at 08:22 PM.
    twitter | Quality Hosting - $5.95/mo*
    Feel free to PM me!


  •  

    Posting Permissions

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