CSS TutorialLesson 26Free preview

CSS Overflow

This lesson is part of CSS · All levels

Summary

Overflow regulates what happens when the contents of an element exceed its size. The value can be visible (below, inside), hidden (cut), scroll (always there is a scrollbar), or auto (scrollbar appears when needed). Overflow is also useful for creating rolling areas within a box, either vertical or horizontal.

Key points

Overflow controls content behavior that exceeds the boundaries of the elements.
The visible allows the content to float, while the hidden cuts it without scrollbars.
Scroll always displays the scrollbar, auto only displays it when the content exceeds the size.
The x- and y-overflows allow for separate configurations per axis.
Overflow: hidden on the parent cutting of bulky content, including effects such as image magnification while hover.

Full lesson

Code examples and quizzes

Full lessons, code examples, and quizzes are available to subscribers. 5 questions.