A Clearer Div

The container div for this paragraph and floated image is outlined in red. Here's the rule in the CSS:

.clear {clear: both;}

Add this nonsemantic div at the end of the material in the div:
<div class="clear"></div>
and the container encloses the entire image.

overflow: auto

The div holding this floated image is given the rule overflow: auto. The blue border indicates that the float is completely contained within its parent element.

Here the rule for this div:

#auto {
border: 1px solid #0000FF;
zoom: 1;
overflow: auto;}

overflow: hidden

The div holding this floated image is given the rule overflow: hidden. The green border indicates that the float is completely contained within its parent element.

#hidden {
border: 1px solid #00CC00;
zoom: 1;
overflow: hidden;}