CSS3 overflow-y Property


Example

Clip the top/bottom edges of the content inside the <div> element - if it overflows the element's content area:

div {
    overflow-y: hidden;
}

Try it yourself »

Definition and Usage

The overflow-y property specifies what to do with the top/bottom edges of the content - if it overflows the element's content area.

Tip: Use the overflow-x property to determine clipping at the left and right edges.

Default value: visible
Inherited: no
Animatable: no. Read about animatable
Version: CSS3
JavaScript syntax: object.style.overflowY="scroll" Try it


Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Property
overflow-y 4.0 9.0 3.5 3.0 9.5


CSS Syntax

overflow-y: visible|hidden|scroll|auto|initial|inherit;

Property Values

Value Description Play it
visible Default value. The content is not clipped, and it may be rendered outside the content box Play it »
hidden The content is clipped - and no scrolling mechanism is provided Play it »
scroll The content is clipped and a scrolling mechanism is provided Play it »
auto Should cause a scrolling mechanism to be provided for overflowing boxes Play it »
initial Sets this property to its default value. Read about initial Play it »
inherit Inherits this property from its parent element. Read about inherit


Related Pages

HTML DOM reference: overflowY property



Color Picker

colorpicker