float
Description
float defines the direction in which an element is floated.
| Item | Value |
|---|---|
| Initial value | none |
| Inherited | No. |
| Version | CSS1 |
| JavaScript syntax | object.style.cssFloat="left" |
| Applies to | All elements. |
Syntax and Property Values
float: left | right | none | inherit;
The property values are listed in the following table.
| Value | Description |
|---|---|
| left | shifted so that the left edge hits the left edge of the containing block or the right edge of another floating block. |
| right | shifted so that the right edge hits the right edge of the containing block or the left edge of another floating block. |
| none | not floated. Default value |
| inherit | Inherit the float property from the parent element |
Example
<!DOCTYPE HTML>
<html>
<head>
<style>
.myStyle {<!--from w ww . j a va 2 s . c o m-->
float: left;
padding: 10px;
margin: 5px;
background-color: #fff;
border: 1px solid #000;
width: 15%;
}
</style>
</head>
<body>
<div class="myStyle">1</div>
<div class="myStyle">2</div>
<div class="myStyle">3</div>
<div class="myStyle">4</div>
</body>
</html>
The code above generates the following result.
