In the last article, we learned about positions in CSS and also created one example involving each of position available in CSS. Today we are going to study about overflow property in CSS.
Let's begin...
The overflow CSS property specifies whether to clip content, show scrollbars, or display overflowing content when it is too large for its block-level container.
The overflow property has the following values:
Let's begin...
The overflow CSS property specifies whether to clip content, show scrollbars, or display overflowing content when it is too large for its block-level container.
The overflow property has the following values:
- visible - This is the default. The overflowing content is not clipped. It renders outside the element's box.
- hidden - The overflowing content is clipped and rest of the content will be invisible.
- scroll - The overflowing content is clipped but scrollbar is added to see the rest of the content.
- auto - If overflow is clipped, a scrollbar is automatically added.
- overlay - Behaves the same as auto, but with the scrollbars drawn on top of content instead of taking up space. Only supported in WebKit-based (e.g., Safari) and Blink-based (e.g., Chrome or Opera) browsers.
Let's see an example to clear all the doubts:
That's all for today. In the next article, we will learn about floating elements in CSS.
Till then #keepCoding.
