Style overflow attribute

Definition and Usage

overflow Property setting or return how to handle the content displayed outside the element box.

Tip:To hide the entire document's scrollbar, use the overflow attribute of the body or html element.

See also:

CSS Tutorial:CSS Overflow

CSS Tutorial:CSS Positioning

CSS Reference Manual:overflow attribute

Example

Example 1

Use the overflow attribute to scroll overflowing content:

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

Try it yourself

Example 2

Use the overflow attribute to hide overflowing content:

document.getElementById("myDiv").style.overflow = "hidden";

Try it yourself

Example 3

Return overflow attribute:

alert(document.getElementById("myDiv").style.overflow);

Try it yourself

Syntax

Return overflow attribute:

object.style.overflow

Set overflow attribute:

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

Attribute Value

Value Description
visible Content is not cropped and may appear outside the element box. Default.
hidden Do not display content outside the element box.
scroll Add a scrollbar and crop content as necessary.
auto Trim content as necessary and add a scrollbar.
initial Sets this property to its default value. See initial.
inherit Inherits this property from its parent element. See inherit.

Technical Details

Default value: visible
Return value: A string that indicates the content rendered outside the element box.
CSS Version: CSS2

Browser Support

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Unterstützung Unterstützung Unterstützung Unterstützung Unterstützung