clear

clear Description:

The clear property defines the sides of the element that should not float. It turns off the floating to that specific side.

clear in CSS Versions:

• CSS 1
• CSS 2
• CSS 3

clear Syntax:

clear: none | left | right | both | inherit

• none
  Floating elements are allowed on both sides.
• left
  Floating elements are not allowed on the left.
• right
  Floating elements are not allowed on the right.
• both
  Floating elements are not allowed on either side.
• inherit
  The element should have the same clear setting as the parent.

clear Initial Value:

none

clear Applies To:

All elements.

clear Inheritance:

This property is not inherited.

clear Browser Support:

• Netscape 4, 6, 7
• Mozilla 1
• Firefox 1
• Internet Explorer 4, 5, 6
• Opera 3, 4, 5, 6, 7, 8
• Safari 1

clear Examples:

clear a right floating image

<p>
<img src="image.gif" alt="image" style="float: right;" />
This text will flow on the left side of the image.<br style="clear:right;" />
This text will display below the image.
</p>

clear Special Notes:

• The cleared element will display directly below the floated element unless there are other layout styles in place.

More clear Information:

• How To Align Tables and Images
• float

Return to the Style Library