Sticky Positioning for Headers
Use CSS sticky positioning to create headers that stay visible during scroll without JavaScript scroll listeners.
Code
.sticky-header {
position: sticky;
top: 0;
z-index: 100;
background: white;
border-bottom: 1px solid #e5e7eb;
}
.sticky-sidebar {
position: sticky;
top: 80px;
align-self: start;
}Report a problem with this exampleOpens a pre-filled issue on GitHub.