ExampleClip the left/right edges of the content inside the div element - if it overflows the element's content area:
Try it yourself » |
The overflow-x property is supported in all of the major browsers.
Note: The overflow-x property does not work properly in Internet Explorer.
The overflow-x property specifies whether or not to clip the left/right edges of the content - if it overflows the element's content area.
Tip: Use the overflow-y property to determine clipping at the top and bottom edges.
Default value: | visible |
---|---|
Inherited: | no |
Version: | CSS3 |
JavaScript syntax: | object.style.overflowX="scroll" |
overflow-x: visible|hidden|scroll|auto|no-display|no-content; |
Value | Description |
---|---|
visible | The content is not clipped, and it may be rendered outside the content box |
hidden | The content is clipped - and no scrolling mechanism is provided |
scroll | The content is clipped and a scrolling mechanism is provided |
auto | Should cause a scrolling mechanism to be provided for overflowing boxes |
no-display | If the content does not fit in the content box, the whole box is removed |
no-content | If the content does not fit in the content box, the whole content is hidden |