Aaron In MinnesotaIt is sort of mind boggling to think about all the JS and browser quirk hacks that would have been needed to get two axis sticky stuff in tables to work well when I was starting out in #webDev. And soon enough, just a few lines of CSS. Wild!
This is true on so many other facets of the web platform these days.
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.