Block 1 gray1 box with 25% width of screen and has a solid 1px border

Block 2 The above box does not have a float therefore the text by default is undernealth.

Block 3 blue2 box adds padding:2px and float:left so box is left of content

Block 4, Float left in a block element, signifies that the next tag element will be to the left

Block 5, gray3 box is float:right of next content and also has padding:1em and margin-left:1em; height : 6em;

Block 6, third gray box has a float right with a margin-left:3px content following this box does not hit the correspond. To clear the horizontal rule one uses style="clear:right;"

Valid XHTML 1.0 Transitional Valid CSS!