Results 1 to 2 of 2

Thread: Question about Footer in CSS layout

  1. #1
    Join Date
    Jul 2010
    Posts
    15

    Question about Footer in CSS layout

    I was just wondering what the proper way to do what I'm about to describe is.

    If you have a CSS layout with your container or content div immediately above your footer, what is the 'proper' way to get your footer to automatically be pushed down when the content area grows taller from putting more content in it? In other words, what is the common way to get the footer to move down the page and remain immediately after the container when the container has more and more content added to it?

    What has seemed to work for me was setting the overflow of the container div to 'hidden', but is this the right way to do it? Or is there a different, more reliable way to accomplish this? Thanks in advance.

  2. #2
    Join Date
    Feb 2006
    Location
    Salisbury UK
    Posts
    4,332
    There are two main ways to code a "sticky footer".
    1. This type stays at the bottom of the window if the page hasn't got enough content to fill the height, but if there is enough content above, the footer stays out of sight immediately below the content and you scroll to see it. See
    http://www.cssstickyfooter.com/
    http://ryanfait.com/sticky-footer/

    2. The footer uses position: fixed; bottom: 0; and is visible all the time and content scrolls behind it.
    Code downloaded to my PC will be deleted in due course.
    WIN7; IE9, Firefox, Opera, Chrome and Safari for Windows; screen resolution usually 1366*768.
    Also IE6 on W98 with 800*600 and IE8 on Vista 1440*900.

Posting Permissions

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