Making a footer stick to the bottom

This is a discussion on "Making a footer stick to the bottom" within the Web Page Design section. This forum, and the thread "Making a footer stick to the bottom are both part of the Design Your Website category.



Go Back   Webforumz.com > Main Forums > Design Your Website > Web Page Design

Notices


Reply
 
LinkBack Thread Tools
  #1 (permalink)  
Old May 25th, 2006, 14:22
Junior Member
Join Date: Mar 2006
Posts: 19
Thanks: 0
Thanked 0 Times in 0 Posts
Making a footer stick to the bottom

Hi All,
I'm trying to get CSS to make my footer stick to the bottom of the page. I've found some CSS help online and have been testing it, but it seems to be just sticking to the bottom of the browser window and not the page. At least in some browsers. Some it works fine, others it doesn't. Here is the page: LINK Any advice? Any help would be great. Thanks!
Reply With Quote

  #2 (permalink)  
Old May 25th, 2006, 14:59
Up'n'Coming Member
Join Date: Apr 2006
Location: Missouri
Age: 31
Posts: 65
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Making a footer stick to the bottom

Post your page code or a link
Reply With Quote
  #3 (permalink)  
Old May 25th, 2006, 14:59
Highly Reputable Member
Join Date: Aug 2005
Location: 3rd Branch Up, Old Oak.
Age: 48
Posts: 658
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Making a footer stick to the bottom

Quote:
Originally Posted by bob_visualefx
it seems to be just sticking to the bottom of the browser window and not the page.
I'm using IE6 and it's on the bottom of the page. Which browsers are you concerned about?
Reply With Quote
  #4 (permalink)  
Old May 25th, 2006, 15:47
Up'n'Coming Member
Join Date: Nov 2005
Location: England
Posts: 71
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Making a footer stick to the bottom

Its broken in firefox. i think you need to put

html {
height: 100%;
}

and take it out of the body tag.
Reply With Quote
  #5 (permalink)  
Old May 25th, 2006, 20:49
Most Reputable Member
Join Date: Apr 2006
Location: Cornwall, UK
Posts: 1,310
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Making a footer stick to the bottom

Quote:
Originally Posted by iZone
and take it out of the body tag.
How can you take anything that is meant to be seen outside the body tag?
Reply With Quote
  #6 (permalink)  
Old May 25th, 2006, 21:08
herkalees's Avatar
Highly Reputable Member
Join Date: Jul 2005
Location: Massachusetts, USA
Age: 87
Posts: 576
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Making a footer stick to the bottom

#footer
{
/*position: relative;
margin-top: -30px;*/
clear: both;
text-align: center;
}
Reply With Quote
  #7 (permalink)  
Old May 25th, 2006, 21:23
Up'n'Coming Member
Join Date: Nov 2005
Location: England
Posts: 71
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Making a footer stick to the bottom

Quote:
Originally Posted by ukgeoff
How can you take anything that is meant to be seen outside the body tag?
i meant for him to take the height: 100% off of his body definition and put it in the html in the css file. I seem to remember doing something similar a while back, but then that could be total poppycock because I cant remember the whole solution.
Reply With Quote
  #8 (permalink)  
Old May 26th, 2006, 13:18
masonbarge's Avatar
Highly Reputable Member
Join Date: Jan 2006
Location: Atlanta GA
Posts: 631
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Making a footer stick to the bottom

Try <div class="clear"></div> just before the footer div.

.clear {clear; both;}
Reply With Quote
  #9 (permalink)  
Old May 26th, 2006, 13:32
Junior Member
Join Date: Mar 2006
Posts: 19
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Making a footer stick to the bottom

That was it! Thanks, man.
Reply With Quote
Reply

Tags
making, footer, stick, bottom

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

Similar Threads
Thread Thread Starter Forum Replies Last Post
Footer directly aligned to bottom thewebkid Web Page Design 2 Dec 25th, 2007 21:36
Problems making horizontal footer with 2 lines... MikeTheVike Web Page Design 6 Jul 13th, 2007 13:06
Positioning a footer at the bottom of the screen apod Web Page Design 1 Oct 8th, 2006 10:04
Background image overlaping footer image at bottom of div lw_d Web Page Design 4 Mar 21st, 2006 00:27
Making a rollover stick when clicked map4202003 Web Page Design 4 Apr 7th, 2004 07:26


All times are GMT. The time now is 09:17.


Powered by vBulletin®
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
Search Engine Friendly URLs by vBSEO 3.2.0 RC8
© 2003-2008 Webforumz.com : All Rights Reserved

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43