CSS footer problem

Do you want your footer to be fixed at the bottom? Because when i open your site the footer appears...

~ Nikos

Sorry Nikolaos, I wasnt clear.

So on the home page it seems to appear correctly, but if you go to the "get a quote" page it shows up at the bottom on my 13" macbook but then on my big monitor shows up about 1/4 up the page, basically below the content.

Hope this helps.

Kris

Allright. This is simple.

The position of the #nav-footer div is defined by the content of the rest of the container.

If you have much content (homepage) the footer appears to be at the end of the site. If not its shown where the content ends.

If you want to get rid of it try using

#your-footer-id{
position: relative;
bottom: 0px;
}

in your css.

~ Nikos.

Nikos,

Thanks a lot! your suggestion didn't fix it 100% but it got me in the right direction. What I did was wrapped my whole footer in a different div named "footer" then pasted this.

.footer {
position: absolute;
bottom: 0px;
background-color: #27241d;
width: 100%;
height: 100px;
}

and now it's at the bottom of both my monitors. Just need to play around with some margins and I think it's good to go.

Thanks again, Kris

Win XP SP2 using Google Chrome (most recent version) and IE7 both show the page footer properly. Which CMS framework are you on? Homebrew? Joomla? Wordpress?

The issue is that without a thoroughly coded back-end to support cross OS/Browser displays you will run into issues with CSS overlap for display elements as well as "jenky" display attributes for a number of elements.

Example: I have a client that refuses to use web approved colors for their logos and typography for the website I am building for them resulting is very strange looking colors on certain browsers and OS's. Specifically the logo color does not match the rest of the website in certain IE browsers.

I'll take a closer look at your CSS and see if I can be more case-specific to your inquiry.

Seth,

currently I am not using a CMS. its just HTML/CSS and php. However I am using twitter bootstrap with it as well.

Also I am on mac OSX mountain lion using chrome.

Kris, I think you're wanting the footer to stick to the bottom of the window no matter the height of the content, correct?

If so, try Ryan Fait's Stick Footers