A box with declaration float: left or float: right is shifted to the left or right on its line. Other content will flow around a floating box.
An element's clear property can be set to left, right, or both to make it display after the corresponding types of floats instead of flowing around them.
Example code:
<p>
'Twas brillig, and the slithy toves did gyre and gimble in the wabe:
<span style='float:left; margin:1ex; padding:4ex; background:lime;'> FLOAT </span>
All mimsy were the borogroves, and the mome raths outgrabe.
<p style="clear:left;">
"Beware the Jabberwock, my son! The jaws that bite, the claws that catch!
Beware the Jubjub bird, and shun the frumious Bandersnatch!"
'Twas brillig, and the slithy toves did gyre and gimble in the wabe: FLOAT All mimsy were the borogroves, and the mome raths outgrabe.
"Beware the Jabberwock, my son! The jaws that bite, the claws that catch! Beware the Jubjub bird, and shun the frumious Bandersnatch!"
'Twas brillig, and the slithy toves did gyre and gimble in the wabe: FLOAT All mimsy were the borogroves, and the mome raths outgrabe.
"Beware the Jabberwock, my son! The jaws that bite, the claws that catch! Beware the Jubjub bird, and shun the frumious Bandersnatch!"