Sometimes, we want to make the contents of a fixed element scrollable only when it exceeds the height of the viewport witrh CSS.
In this article, we’ll look at how to make the contents of a fixed element scrollable only when it exceeds the height of the viewport with CSS.
How to make the contents of a fixed element scrollable only when it exceeds the height of the viewport with CSS?
To make the contents of a fixed element scrollable only when it exceeds the height of the viewport witrh CSS, we set the overflow property.
For instance, we write
.stuck {
position: fixed;
top: 10px;
left: 10px;
bottom: 10px;
width: 180px;
overflow-y: scroll;
}
to add overflow-y: scroll;
to make the element vertically scrollable.
Conclusion
To make the contents of a fixed element scrollable only when it exceeds the height of the viewport with CSS, we set the overflow property.