2026-08-21 — Select scroll lock keeps sticky header

Summary

Opening a Radix Select (for example on /dev/nabla) no longer makes the site sticky header scroll away, and no longer horizontally contracts the page when the menu opens. Menus still portal above the chrome.

Highlights

  • Root cause (sticky): Select mounts react-remove-scroll, which sets body[data-scroll-locked] { overflow: hidden !important }. That makes body a sticky containing block while html remains the page scroller, so .ftn-site-header unsticks.

  • Fix (sticky): html body[data-scroll-locked] { overflow: clip !important } in globals.css. Clip still clips but is not a scrollport, so sticky keeps using the html/viewport scrollport. Wheel/touch lock stays in RemoveScroll’s event handlers.

  • Root cause (horizontal contract): RemoveScroll also applies margin-right: <scrollbar-gap> assuming it hid a classic scrollbar. With overflow: clip, the real scrollbar (and gutter) stay on html, so that margin became a second gutter and the page jumped narrower.

  • Fix (gutter): zero RemoveScroll’s lock-time margin/padding compensation on body, and set scrollbar-gutter: stable on html so the scrollport width stays constant if a lock ever does hide the bar.

  • Select content was already portaled with z-[60] above sticky chrome (z-50) and fixed frost (z-49); stacking was not the failure mode.