Style overflow Property

Example

Use the overflow property to scroll overflowing content:

document.getElementById("myDIV").style.overflow = "scroll";
Try it Yourself »

Description

The overflow property sets or returns what to do with content that renders outside the element box.

Tip: If you want to hide the scrollbars of the entire document, use the overflow property on the body or the html element.


Browser Support

Property
overflow Yes Yes Yes Yes Yes

Syntax

Return the overflow property:

object.style.overflow

Set the overflow property:

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

Property Values

Value Description
visible Content is NOT clipped and may be shown outside the element box. This is default
hidden Content outside the element box is not shown
scroll Scroll bars are added, and content is clipped when necessary
auto Content is clipped and scroll bars are added when necessary
initial Sets this property to its default value. Read about initial
inherit Inherits this property from its parent element. Read about inherit


Technical Details

Default Value: visible
Return Value: A String, representing the content that renders outside the element box
CSS Version CSS2

More Examples

Example

Use the overflow property to hide overflowing content:

document.getElementById("myDiv").style.overflow = "hidden";
Try it Yourself »

Example

Return the overflow property:

alert(document.getElementById("myDiv").style.overflow);
Try it Yourself »

Related Pages

CSS tutorial: CSS Overflow

CSS tutorial: CSS Positioning

CSS reference: overflow property


Copyright 1999-2023 by Refsnes Data. All Rights Reserved.