HTML and CSS Reference
In-Depth Information
}
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.
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.
Floating Multicolumns
