Example
Let an image float to the left/right of the text, when clicking on two buttons:
function floatRight()
{
document.getElementById("myImg").style.cssFloat = "right";
}
function floatLeft()
{
document.getElementById("myImg").style.cssFloat = "left";
}Try it Yourself »
Definition and Usage
The cssFloat property sets or returns the horizontal alignment of an element.
Note: The CSS "float" property is called "cssFloat" in JavaScript, because "float" is a reserved word in JavaScript.
Note: If there is too little space on a line for the floating element, it will jump down to the next line that has enough space.
Browser Support
The cssFloat property is supported in all major browsers.
Syntax
Return the cssFloat property:
object.style.cssFloat
Set the cssFloat property:
object.style.cssFloat="left|right|none|initial|inherit"
Property Values
| Value | Description |
|---|---|
| none | The object/element is not floated. This is default |
| left | The object/element will float to the left in the parent element |
| right | The object/element will float to the right in the parent element |
| initial | Sets this property to its default value. Read about initial |
| inherit | Inherits this property from its parent element. Read about inherit |
Technical Details
| Default Value: | none |
|---|---|
| Return Value: | A String, representing the horizontal alignment of an element |
| DOM Version | DOM Level 2 |
More Examples
Example
Change the cssFloat property of a DIV element:
document.getElementById("myDIV").style.cssFloat = "left";
Try it Yourself »
Related Pages
CSS tutorial: CSS Float
< Style Object