View Full Version : The Clear Tag??

Jan 28th, 2007, 02:56 AM
Im looking a simple, brain dead guide to the clear div. The one that sets each column the same one as the longest. Is simply a matter of having the coding in the style and then the div in the body. Similiar to forming a column. Im confused because I dont understand the coding and I have also seen one method that involves images.

If you had columns to set the same length what code do you use?

Jan 28th, 2007, 03:14 PM

Jan 28th, 2007, 03:21 PM
Ive read this and I dont understand it!!

Jan 28th, 2007, 04:13 PM
Ive read this and I dont understand it!!

Basically it's just faking it by using a vertically tiled background image.

Here's another approach (along with a simple explanation) from coding forums member Excavator:

equal length columns (http://www.nopeople.com/CSS/equal_length_columns/)

Hope that helps,


Jan 29th, 2007, 07:43 PM
the faux columns page is good but it does go on a bit and doesn't explain the clear CSS attribute correctly.

I have a website somewhere which explains it in depth i will find it when i get home

Jan 29th, 2007, 09:38 PM
All clear does is to make sure that the cleared element does not appear next to a floated element contained within the same container.

<div id="c">
<div id="c1" style="float:left">some content</div>
<div id="c2">some more content</div>
<div id="c3" style="clear:left">content to go under c1</div>

With this code the content in c1 will be floated left and the content of c2 will be placed to the right of it wrapping around under it if it is long enough. Regardless of whether he c2 content goes as far down as the c1 content the c3 content will go under it because it has been told to go clear of any floated left content.

Jan 29th, 2007, 11:36 PM
I see, Im using the overflow: auto; div in my last column, in IE it appears the same length as the column but in Firefox it doesn't work at all.