Getting StartED with CSS

Float Properties

There are just two properties connected with floating, the process whereby an element is moved to the left or right, and all subsequent content moves up to fill the horizontal space alongside. Typical uses are flowing text around images (see Chapter 4), creating sidebars (see Chapter 7), and creating a horizontal row of elements that would normally sit one on top of the other, such as converting an unordered list into a navigation bar (see Chapter 8). The float property is also used extensively in page layout, as described in Chapter 11.

clear

Accepted values:
none, left, right, both
Default:
none
Inherited:
No

Prevents an element from moving up alongside a previously floated element. The property’s value determines whether this applies to all floated elements (both) or to those floated to a particular side.

float

Accepted values:
left, right, none
Default:
none
Inherited:
No

Moves an element to the specified side, and allows following elements to move up to fill the horizontal space vacated alongside it. When applied to inline elements, such as images, the inline element is treated as a block.