What is Clear in CSS

I want to know what is the purpose and meaning of clear in css? it has 3 available options: both, left or right . what does it mean.
Please describe it if you know about it...

 

http://www.w3.org/TR/REC-CSS1#clear

 

simply, it clears a float.

 

This was hard for me to understand too. but lets say you use float to align two divs. One to the right and another to the left like this:

<div style="float:left;width:400px;"></div><div style="float:right;width:400px;"></div>

<div class="footer"></div>

Code (markup):

If you leave the code like that the footer will appear on top of the two floating divs. To fix this change the footer code to this:

<div class="footer" style="clear:both;"></div>

Code (markup):

I hope that example helped

 

Just like veckd said, it's usually (from what I've seen) used for footers and such to clear other "floating" div's..

 

Don't know why one would apply a class of footer to a footer. And your example would be better off with height on the floating divisions.

 

okay change it to id then...

 

helped me a lot too, thx

 

You can also use "CLEAR: ALL"

 

RedMatrix, not only are you using non standard or at best, ugly uppercase, but clear: all is not a valid value and you could have checked this yourself by looking at the link to the spec in the second post!

 

Did I say all? My bad, I meant both.