float

Browser Internet Explorer Netscape Opera Safari Firefox
Version 5.5 6.0 7.0 8.0 8.0 9.0 7.0 8.0 9.2 9.5 1.3 2.0 3.1 1.5 2.0 3.0
Supported Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes
Short information
CSS CSS1
Default value none
Inherited No
Applied To all elements (except docked)
HTML analog <applet | iframe | img | object | spacer | table align="right | left">
Reference to specification http://www.w3.org/TR/CSS21/visuren.html#propdef-float
Description
It defines on which side the element will be aligned. Thus other elements will flow round it from other sides. When the parameter value float is equal none, the element is deduced on page as usually. The biggest value means that one line of the flowing text can be on the same line as an element.

Syntax

float: left | right | none
Arguments
left
It aligns an element by a left border. All other elements like the text float it on the right side.
right
It aligns an element by a right border. All other elements float it on the left side.
none
Float is not specified.

Example

 
<!--
   .layer1 {
    float: left; /* Right edge float */
    background: #fd0;  /* Background color */
    border: 1px solid black;  /* frame parameters */
    padding: 10px;  /* areas around the text */
    margin-right: 20px;  /* Right indent */
    width: 40%; /* Block width */
   }
 
-->
<div class="layer1">
   Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh
   euismod tincidunt ut lacreet dolore magna aliguam erat volutpat.</div>
<div>
   Duis autem dolor in hendrerit in vulputate velit esse molestie consequat, vel
   illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio
   dignissim qui blandit praesent luptatum zzril delenit au gue duis dolore te
   feugat nulla facilisi.</div>
The result of this example is shown on the figure 1

Object model
[window.]document.getElementById("elementID").style.styleFloat
[window.]document.getElementById("elementID").style.cssFloat