A floated image affects all the elements that follow it, unless you insert a special line break. The clear attribute added to the regular br tag indicates that the text should not begin until the specified margin is clear (that is, at the end of the image or images).
To stop elements from wrapping:
Figure 5.28. Notice the order: first the house, then the header, then the flower logo, then more text.
Figure 5.29. The clear="left" attribute makes the text stop flowing until it reaches an empty left margin (that is, below the bottom of the left-aligned flower).
Figure 5.30. With clear="all" the text won't flow until both the left and right margins are completely clear.