Footer won’t stay below content

@downtimeFeb 06.2009 — #There is something strange with the way you created the page that has this not really acting like a column layout and I think that is causing the white gap near the bottom above the footer. The expandedcontent div seems outside the normal flow and is just constrained to fit where it is. When ever your right column pushes the container box lower than expandedcontent div, you're going to get that white box.

It might be better if you had a maincontent div that had three column divs inside it, floating next to each other. You can use the maincontent div to repeat your background image vertically so that the entire content area's background extends to the bottom of the maincontent div and you don't get gaps.

Typically when using floats, if something isn't working the way you expect, the problem is caused by either widths not being what you expect or you haven't cleared elements that need to be cleared.

For something like a footer that should span the entire width, you should use:

clear: both;

On your footer div. This will make sure nothing floats to the left or right of it.

@caravanguardauthorFeb 09.2009 — #I've begun to rebuild with all divs as floats and one background image as you suggested, and so far so good. The footer is floating beneath the content and the mid section expands without any problems. (In FF anyway!)

Thanks for your help!

Footer won’t stay below content

2 Comments(s) _↴

Also in #CSS _↴

Success!

Social

Version

Footer won’t stay below content

2 Comments(s) ↴

Also in #CSS ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

2 Comments(s) _↴

Also in #CSS _↴