Style overflowX Property

Definition and Usage

overflowX This property specifies how to handle the left/right edges of the content - if it overflows the element's content area.

Tip:Use overflowY property to determine the clipping of the top and bottom edges.

See also:

CSS Reference Manual:overflow-x Property

Example

Horizontal scrolling if the text overflows the element's content area:

document.getElementById("myDIV").style.overflowX = "scroll";

Try it yourself

Syntax

Returns the overflowX property:

object.style.overflowX

Sets the overflowX property:

object.style.overflowX = "visible|hidden|scroll|auto|initial|inherit"

Attribute value

Value Description
visible Content is not clipped and may be rendered outside the content box.
hidden Content is clipped - no scrolling mechanism is provided.
scroll Content is clipped and a scrolling mechanism is provided.
auto If the overflow box, then a scrolling mechanism should be provided.
initial Sets this property to its default value. See also initial.
inherit Inherits this property from its parent element. See also inherit.

Technical details

Default value: visible
Return value: A string that represents the element's overflow-x Property.
CSS Version: CSS3

Browser Support

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support Support Support Support Support