CSS overflowProperty
Example
Set different overflow property values:
div.ex1 {
overflow: scroll;
}
div.ex2 {
overflow: hidden;
}
div.ex3 {
overflow: auto;
}
div.ex4 {
overflow: visible;
}
Try it Yourself »
Attribute definition and usage instructions
The overflow property specifies what happens if content overflows an element's box.
| Default value: | visible |
|---|---|
| Inherited: | no |
| version: | CSS2 |
| JavaScript Syntax: | object.style.overflow="scroll" |
Browser Support
The numbers in the table indicate the first browser version number that supports the property.
| Property | |||||
|---|---|---|---|---|---|
| overflow | 1.0 | 4.0 | 1.0 | 1.0 | 7.0 |
Note:In OS X Lion (Mac OS), scrollbars are hidden by default and only appear when being used (even if "overflow:scroll" is set).
Property value
| Value | Description |
|---|---|
| visible | Default value. Content is not clipped and will be rendered outside the element's box. |
| hidden | Content is clipped, and the rest of the content is invisible. |
| scroll | Content is clipped, but the browser will display scrollbars to view the rest of the content. |
| auto | If content is clipped, the browser will display scrollbars to view the rest of the content. |
| inherit | Specifies that the value of the overflow property should be inherited from the parent element. |
Related Articles
CSS Tutorial:CSS Positioning
other extensions