What exactly does clear do

[kutchbhi]

This should be simple , but the explanations in books and tutorials don't make sense to me.
what exactly does the clear property do?
I want to know exactly ,EXACTLY what it does.
Take for example this code:

p.one {

width: 200px ;
float: left ;
clear:both;
}
p.two {

width: 200px ;
float: left ;
}
div.goaway {
    border : 2px solid blue ;
    }
<p class="one">dfgspara3 para3 </p>

<p class="two">para3 para3  </p>

<div class="goaway">
<form id="crazy" action="">
    <input id="great" type="text">
    <input type="checkbox">
    <a href="#">Some link</a>
    <input type="text"> <input type="text"> <input type="text">
    <a href="#">Some link</a>
</form>
</div>

Applying clear:both to p.one has no effect whatsoever. Why ?
Please explain.

Thanks

[breakzzzz20]

your in a php section,

[JorgeM]

Not sure what you are trying to accomplish with the clear. Can you elaborate?

Normally, you can use the clear property to have your HTML element either clear left, right, or both. For example, if you had an image above the paragraph that had the float set to left, without a clear, your paragraph would wrap around the picture. if you want the paragraph to clear it, you could set the paragraph to clear:right. If you had two elements that were floating above the paragraph and you need to clear them both, then you would set the paragrpah to clear:both.

[drjohn]

When you float items, say an image or div, the next item below it, if another image or div, can catch on to the lower edge and get stuck, sort of bumping into it instead of going past it; or as mentioned above, in the case of text it can wrap round the object then below it once all the space to the side is filled with text.

clear effectively says do the equivalent of start a "guarenteed new line" below the lowest edge of the floated object. The clear: left or clear: right bit means only do this to things floated left or right respectively. clear: both means which ever float there is, clear it, get underneath it.

[Philippe.Lahaie]

in your example, p one does not clear p two simply because it comes before p two in the html.

whenever you float something, it gets detached from the default "block" objects. Clear allows you to control the position of floating objects. i know this sounds obscur but take your 2 paragraph example, since they are floating they will display "inline" instead of "block. so depending on their respective width, and the width of their parent container, they could be next to eachother, if there is enough room, if there isnt, it would float to the next position where there is enough room for it. Clear allows you to tell an object to go past any (previously added) floated elements, wheter there is or isnt space for it on the same line.

w3 schools would probly explain it even better than i would though, try reading these two pages :
floating
clear