CSS float Property


Example

Let an image float to the right:

img  {
    float: right;
}

Try it yourself »

More "Try it Yourself" examples below.


Definition and Usage

The float property specifies whether or not a box (an element) should float.

Note: Absolutely positioned elements ignores the float property!

Default value: none
Inherited: no
Animatable: no. Read about animatable
Version: CSS1
JavaScript syntax: object.style.cssFloat="left" Try it


Browser Support

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

Property
float 1.0 4.0 1.0 1.0 7.0


CSS Syntax

float: none|left|right|initial|inherit;

Property Values

Value Description Play it
none The element is not floated, and will be displayed just where it occurs in the text. This is default Play it »
left The element floats to the left Play it »
right The element floats the right Play it »
initial Sets this property to its default value. Read about initial Play it »
inherit Inherits this property from its parent element. Read about inherit


Examples

More Examples

Let the first letter of a paragraph float to the left
Let the first letter of a paragraph float to the left and style the letter.

Creating a horizontal menu
Use float with a list of hyperlinks to create a horizontal menu.

Creating a homepage without tables
Use float to create a homepage with a header, footer, left content and main content.


Related Pages

CSS tutorial: CSS Float

HTML DOM reference: cssFloat property



Color Picker

colorpicker