Expand All | Collapse All

CSS float Property

Topic: CSS3 Properties ReferencePrev|Next


The float CSS property specifies whether a box should float to the left, right, or not at all.

The following table summarizes the usages context and the version history of this property.

Default value: none
Applies to: All elements
Inherited: No
Animatable: No. See animatable properties.
Version: CSS 1, 2, 3


The syntax of the property is given with:

float left | right | none | initial | inherit

The example below shows the float property in action.

p.red {
    float: left;
p.green {
    float: right;

Property Values

The following table describes the values of this property.

Value Description
left The element float on the left side of its containing block. Content flows on the right side of the box, starting at the top.
right Similar to left, except the box is floated to the right, and content flows on the left side of the box, starting at the top.
none The box is not floated. This is default value.
initial Sets this property to its default value.
inherit If specified, the associated element takes the computed value of its parent element float property.

Browser Compatibility

The float property is supported in all major modern browsers.

Browsers Icon

Basic Support—

  • Firefox 1+
  • Google Chrome 1+
  • Internet Explorer 4+
  • Apple Safari 1+
  • Opera 7+

Further Reading

See tutorial on: CSS Float, CSS Alignment.

Position-related properties: position, top, right, bottom, left, display, clear.

Bootstrap UI Design Templates Property Marvels - A Leading Real Estate Portal for Premium Properties