Style overflowXProperty
Examples
If the text overflows the element's content area, provide horizontal scrolling:
document.getElementById("myDIV").style.overflowX="scroll";
Try it Yourself »
Definition and Usage
The overflowX property specifies whether to clip the left/right edges of the content - if the content overflows the element's content area.
Tip:Please useoverflowYthe property to determine clipping of the top/bottom edges.
Browser Support
![]()
All major browsers support the overflowX property.
Note:The overflowX property does not work in IE8 and earlier versions.
Syntax
Return the overflowX property:
object.style.overflowX
Set the overflowX property:
object.style.overflowX="visible|hidden|scroll|auto|initial|inherit"
Property Values
| Value | Description |
|---|---|
| visible | Content is not clipped, it may be displayed outside the content box. |
| hidden | Content is clipped, and no scrolling mechanism is provided. |
| scroll | Content is clipped, and a scrolling mechanism is provided. |
| auto | If the box overflows, a scrolling mechanism should be provided. |
| initial | Sets the property to its default value. Seeinitial。 |
| inherit | Inherits the property from its parent element. Seeinherit。 |
Technical Details
| Default value: | visible |
|---|---|
| Return value: | A string representing the overflow-x property of the element. |
| CSS Version | CSS3 |
Related Articles
CSS Reference Manual:overflow-x property
Other Extensions
Style Object