The clear property (CSS Reference)
Introduction
The clear property can be used to set the floating element
according to the previously placed element. This can be in the case when you
are inserting images and need to place the description of the image next to the
image. However further text should be placed under the image. For such a
situation you can use the clear property.
Example
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
p.right
{
clear:right;
}
p.left
{
clear:left;
}
</style>
<title>clear Demonstration</title>
</head>
<body>
<h1><p>Note how the text is forced to float
under the image.</p></h1>
<img style="float:left" src="area.jpg">
<p class="right">As you can see this text is
next to the image.</p>
<p class="left">As you can see this text is
left under the image.</p>
</body>
</html>
Output
Values
|
Name:
|
Description:
|
|
both
|
The element is placed below all previous elements.
|
|
none
|
Element has no restrictions where it has to be placed.
|
|
left
|
The element is placed below the previous placed element on
the left side.
|
|
right
|
The element is placed below the previous placed element on
the left side.
|
|
Email TopXML