/    Sign up×
Reference /Pin to ProfileBookmark

The clear property controls how elements next to floated elements should flow.

Syntax

This property designates what should happen with an element that is next to an element that has a float set.

img.ex {
  float: left;
}

img.ex::after {
  clear: left;
}

Values

none
Default value. The element is not pushed below floated elements.

left
The element is pushed below elements that are floated left.

right
The element is pushed below floated elements that are floated right.

both
The element is pushed below elements that are floated both left and right.

initial
Sets the property to its default value.

inherit
Inherits this property’s value from its parent item.

Browser Compatibilty

Demos

Have a code example of clear? Submit a codepen.io demo and we'll showcase it here

to submit a demo.
CSS
×

Success!

Help @reference spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 11.5,
social: @webDeveloperHQ,
});

legal: ({
terms: of use,
privacy: policy
analytics: Fullres
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: Anonymous,
tipped: article
amount: 1000 SATS,

tipper: @aldoushuxley,
tipped: article
amount: 1000 SATS,

tipper: Anonymous,
tipped: article
amount: 1000 SATS,
)...