 Abakada: Back to Basics > Language References > CSS Properties > Box Properties > clear Property
Sets or retrieves whether the object allows floating objects on its left and/or right sides so that the next text will display past the floating objects.
| CSS |
{ clear: 'none' | 'left' | 'right' | 'both' } |
| Script |
object.style.clear = sClear ] |
| none |
Floating objects are allowed on both sides. |
| left |
Object is moved below any floating object on the left side. |
| right |
Object is moved below any floating object on the right side. |
| both |
Object is moved below any floating object. |
The property is read/write with a default value of none; the CSS property is not inherited.
The value of this property lists the sides where floating objects are not accepted.
The following examples demonstrate use of inline event handlers to dynamically set the placement of text relative to floating elements. Both methods yield the same effect.
The sample below uses calls to an embedded stylesheet to move the text below the floating objects when italic text is encountered.
<style>
I { clear:"left"}
</style>
 Show me
The sample below uses inline event handlers to affect the text.
<img src="sample.jpg"
style="float:left"
onclick="this.style.clear='left'">
Show me
float
|