HTML and CSS Reference
2. Save styles.css.
By clearing the left side of the <div class=”benefits”> element, you tell the browser this element shouldn't
have a floating element to its left. When you declare clear: left; , the browser positions a cleared element to
make sure its top border is below the bottom border of the floating element, pushing that element down, as shown in
Figure 8-2 The <div class=”benefits”> element clearing any floating elements to its left.
Likewise, if you need to clear the right side, you can declare clear: right; , or to clear both sides, you can de-
clare clear: both; .
If you give the .benefits rule set the declaration clear: both; , because no elements are floating to the right,
the same visual effect is achieved.