The overflow represents the flow of the content outside of the content's area. The content may float outside of the conent's area or may be invisible.
There are many values of this property. All of the values have been described with the examples.
If the content flows outside of the box, then it is visible. It is default property.
The content can be seen even outside the box.
In this case, if the content flows outside of the box, then it becomes invisible.
The content can not be seen in this case that flows outside of the box.
If the content is larger than the box, then we can see the content using scroll bar.
In this case, we can see the scroll bar area along x and y axes even if the text is not present.
In this case, the scroll bar appears only when the text overflows. While in the case of overflow:scroll, the scroll bar area is always present.
In the above example, when the text overflows then a vertical scroll bar appears that we use to see the rest content.
Was this article helpful?