PDA

View Full Version : Clear is messing up layout



kembreg
Jan 11th, 2007, 11:00 AM
Hello all.
I have a 2 column layout based on a float.

In the right column I am floating a container.
In the next container I clear the float.
However, this container then appears below the bottom of the left column.

You can see this happening here:

http://www.linguashop.com/products.html

The CSS code is also available
(On the site "See CSS")

Any ideas why this is happening?

David

VIPStephan
Jan 11th, 2007, 12:54 PM
You aren't floating the right container but the left column. And of course if you clear a float the flow of elements will continue below the floated elements. That's what the clear property is there for. For me (Fx 2) it worked to just remove the clear. However, what you need is some element that clears the float after the content (but still within that main container) to keep the container with the background color going dow to the bottom. Or, the simpler way is to apply the background to the main container.

Hope that makes sense?

Here's something for you to read: http://css.maxdesign.com.au/floatutorial/
And here's a site with a CSS layouts that has a better approach: http://bonrouge.com/2c-hf-fixed.php