#Development #Techniques
CSS ‘position: sticky’ per axis · Get ready for sticky headers and columns in data tables https://ilo.im/16bshn
_____
#CSS #Scrolling #Headers #DataTables #FeatureDetection #ProgressiveEnhancement #Chrome #Browser #WebDev #Frontend

CSS position: sticky now sticks to the nearest scroller on a per axis basis!
If you’ve ever tried to build a data table with a sticky header and a sticky first column, you know the pain. You’d think a simple position: sticky with top: 0 and left: 0 would be enough, but the reality was that only one of both would stick. A recent change to CSS fixes this: position: sticky now plays nice with single-axis scrollers, allowing you to have sticky elements that track different scroll containers on different axes. This change is available in Chrome 148.



