Page Layout with CSS - Web Development and Design Foundations with XHTML - page 227

Figure 6.12 displays a screen shot of this page. Review Figure 6.12 and note two
changes: the light background color of the <div> extends farther down the page and
the <h2> text begins on its own line under the image.
Figure 6.12
The clear property
is applied to a line
break tag
If you are not concerned about the light background color display, another option is to
omit the line break tag and, instead, apply the clearleft class to the <h2> tag. This
does not change the display of the light background color, but it does force the <h2>
text to begin on its own line, as shown in Figure 6.13 (see the student files at
Chapter6/floatylsclear2.html).
Figure 6.13
The clear property
is applied to a <h2>
tag
The overflow Property
The overflow property can also be used to clear a float, although its intended purpose is
to configure how content should display if it is too large for the area allocated. The
default value of the overflow property is visible —the content is displayed, and if it's
too large, the content will “overflow” outside the area allocated to it. Other values for the
overflow property include hidden (the content is clipped to fit the room allocated), auto