homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderator: open

CSS Forum

problems with creating a footer
I'm trying to create a nav bar at the bottom of my page

 8:52 am on Jun 3, 2008 (gmt 0)

Hi! I'm new to the forums and working on my first website, so please forgive me if i seem ignorant. I'm trying to a put a few links at the bottom of my pages (like where you see copyright notices and contact links on a lot of pages).I read some of the threads here and figured that i should create a </div> that has the following style:

.footer {
position: absolute;
left: 0px;
bottom: 0px;
width: 100%;

This works for the shorter pages, but the problem is that the code does not work for the pages on my site that are longer than the screen (i.e. you need to scroll down to get to the bottom).

Thanks for your help!



 1:15 pm on Jun 3, 2008 (gmt 0)

I wouldn't think that you would need to use absolute positioning. Going with the natural flow the footer should be the last div on your page.


 3:21 pm on Jun 3, 2008 (gmt 0)

I tried that, but for the pages with little content on it, that results in the Links appearing directly below the content (not at the bottom). If i try to just insert some space in between, it still doesn't work because on different monitors.


 3:43 pm on Jun 3, 2008 (gmt 0)

I understand what you mean now. Are you using tables or all divs?



 4:02 pm on Jun 3, 2008 (gmt 0)

I'm using all divs. At the top of every page I have my logo and under that a Nav Bar (Rollover images) and under that I use divs to put whatever content I need.


 4:21 pm on Jun 3, 2008 (gmt 0)

If you don't have enough content to "push" the footer down you could set a


in your footer div. However this may cause problems if your content ends up exceeding the amount that you set. May work OK in some browsers but not others.

Perhaps someone more knowledgeable out there can help you further.



 4:57 pm on Jun 3, 2008 (gmt 0)

I kind of figured it out using your idea. i set a

margin-top: 100%

in the div and it works on most of the pages.

Thanks for your help Blair,


Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved