Welcome to WebmasterWorld Guest from 18.208.159.25

Forum Moderators: not2easy

Message Too Old, No Replies

Positioning Footer

     
11:23 pm on Aug 26, 2005 (gmt 0)

Junior Member

10+ Year Member

joined:Apr 5, 2005
posts:89
votes: 0


Im sort of new to css but wouldnt consider myself a newbie...

I am trying to position my footer so you can only see it if the user scrolls down.

Here's an example of what I have now:

#content {
position:absolute;
top:200px;
}

#footer {
position:absolute;
bottom:-80px;
}

The problem is the content runs over the footer in some of my longer content pages. How can I position the footer?

1:18 am on Aug 27, 2005 (gmt 0)

Junior Member

10+ Year Member

joined:Oct 7, 2004
posts:89
votes: 0


Matrixster,

You may be able to clear to footer so that it will only display when it is clear of every other element ie:

#footer {clear:both}

Alternatively you may be able to add padding to the bottom of the content ir:

#content {padding-bottom:80px}

Let me know how ya go
-Harvs-

5:39 pm on Aug 30, 2005 (gmt 0)

Junior Member

10+ Year Member

joined:Apr 5, 2005
posts:89
votes: 0


neither of those seemed to work....
7:25 pm on Aug 30, 2005 (gmt 0)

Preferred Member

10+ Year Member

joined:Aug 11, 2005
posts:386
votes: 0


Harvs and Matrixster-

Am I wrong in my recollection that you can't just plug in
#footer {clear:both} without changing its position attribute, which is currently 'absolute'? The absolute positioning of the element will override its attempts to clear any other content.

I believe that floating your #content and then using the 'clear' attribute on the #footer will work, as long as you don't have either of them absolutely positioned. I've been wrong before though. I've also been passed out while people spread hot tuna all over my back before... but that's beside the point.

9:28 pm on Aug 31, 2005 (gmt 0)

Junior Member

10+ Year Member

joined:Apr 5, 2005
posts:89
votes: 0


ok, I got rid of absolute positioning and I added the following to my content

padding-bottom:25%

and then used

clear:both

on the footer

Is it ok, browser wise to list padding as a %?