Table of Contents | All Slides | Link List | Examples | CSCI E-75
<< previous | next >>

Float Opposite

Use float: left and float: right for content to be on opposite sides.

float opposite

Example 10.40
Example 10.40 Source:
In style element (<style type="text/css">) within head element:
Example 10.40 Rendered:

The background color of the parent div did not display. The content of this div has been "floated," therefore it has been removed from the calculation of its box model. The parent div size is null. Solution: float the parent div. Recall that a float is always with respect to the containing box.

float opposite

Example 10.41
Example 10.41 Source:
In style element (<style type="text/css">) within head element:
Example 10.41 Rendered:
Table of Contents | All Slides | Link List | Examples | CSCI E-75
<< previous | next >>