CSS clear Property

Example

The <p> element is pushed below left floated elements (the <p> element do not allow floating elements on the left side):

img {
  float: left;
}

p.clear {
  clear: left;
}

Definition and Usage

The clear property controls the flow next to floated elements.

The clear property specifies what should happen with the element that is next to a floating element.

Default value:	none
Inherited:	no
Animatable:	no.
Version:	CSS1
JavaScript syntax:	object.style.clear="both"

• Inherited : "Inherited = no" means that it cannot takes (inherit) it's value from it's parent element.
• object - object in javascript means the element on which clear is applied.
• Animatable - "Animatable = no" means that it cannot be animated with CSS @keyframes.

Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Property
clear	1.0	5.0	1.0	1.0	6.0

CSS Syntax

clear: none|left|right|both|initial|inherit;

Property Values

Value	Description	Demo
none	Default. The element is not pushed below left or right floated elements
left	The element is pushed below left floated elements
right	The element is pushed below right floated elements
both	The element is pushed below both left and right floated elements
initial	Sets this property to its default value.
inherit	Inherits this property from its parent element.