CSS Overflow

CSS Tutorial  >  Position  >  Overflow

The overflow property indicates how the content will be displayed when it exceeds the containing element. Possible values are:

• visible: The entirety of the content is shown, regardless of the height specified for the element.
• hidden: Only the content within the containing element is shown.
• scroll: Displays the vertical and horizontal scroll bar to allow scroll of the content, regardless of whether the content exceeds the containing element.
• auto: If the content is beyond the containing element, a scroll bar is displayed.

Examples for each type of overflow property are shown below:

auto We are using this area to show how different values of the overflow property will behave. This particular one is on the auto value.	hidden We are using this area to show how different values of the overflow property will behave. This particular one is on the hidden value.
visible We are using this area to show how different values of the overflow property will behave. This particular one is on the visible value.	scroll We are using this area to show how different values of the overflow property will behave. This particular one is on the scroll value.

Link to this page: If you find this page useful, we encourage you to link to this page. Simply copy and paste the code below to your website, blog, or profile.

<a href="http://www.1keydata.com/css-tutorial/overflow.php">CSS Overflow</a>