All Our Services

W3Schools offers a wide range of services and products for beginners and professionals, helping millions of people everyday to learn and master new skills. div.ex1 {
overflow-y: scroll;
}

div.ex2 {
overflow-y: hidden;
}

div.ex3 {
overflow-y: auto;
}

div.ex4 {
overflow-y: visible;
} Try it Yourself »

Definition and Usage

The overflow-y property specifies whether to clip the content, add a scroll bar, or display overflow content of a block-level element, when it overflows at the top and bottom edges.

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

Show demo ❯

Browser Support

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

Numbers followed by -ms-, specify the first version that worked with a prefix.

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

Report Error

If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

help@w3schools.com

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning.
Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness
of all content. While using W3Schools, you agree to have read and accepted our terms of use , cookie and privacy policy .

W3Schools is Powered by W3.CSS .