Sometimes, we want to keep the header static and always on top while scrolling with CSS.
In this article, how to keep the header static and always on top while scrolling with CSS, we will look at.
How to keep the header static and always on top while scrolling with CSS?
To keep the header static and always on top, we can set the position style to sticky while scrolling with CSS.
For instance, we write
header {
position: sticky;
top: 0;
}
to set the position of the header to sticky.
And we set top to 0 to keep it on the top of the page.
Conclusion
To keep the header static and always on top, we can set the position style to sticky while scrolling with CSS.