Every sidebar/rail column across the app (feed's left filter panel and
right rail, post detail's left/right rails, profile's sidebar, the
leaderboard's two rails, the dashboard sidebar, and the DeepSearch
citations pane) is `position: sticky` with no max-height or overflow
of its own. When a column's content is taller than the viewport, it
doesn't scroll with the page while pinned - it renders past the
bottom of the screen, unreachable until it "un-sticks" and flies past
during a fast page scroll. Confirmed live: the docs nav sidebar alone
is ~4300px of links against a ~900px viewport.
Each sticky column now gets a max-height matched to its own top
offset, `overflow-y: auto`, `overscroll-behavior: contain`, and a
hidden scrollbar (scrollbar-width/-ms-overflow-style/::-webkit-
scrollbar), the same invisible-scroll recipe already used by the
messages page. Purely additive CSS - no template changes, since every
target already had a distinguishing class.
Fixing the shared `.sidebar-card` component in sidebar.css covers
feed, admin, docs, gists, projects, battles, quizzes, and every
/tools/* page in one place. Also caught and fixed a latent bug along
the way: post.css already neutralized nested `.sidebar-card`s inside
`.post-page-sidebar` (position: static) to stop them independently
double-sticking, but the identical setup on the quiz page
(`.feed-right` wrapping the scoreboard's two `.sidebar-card`s) never
got that override - added the matching `.feed-right .sidebar-card`
rule.
Verified live with Playwright at a squeezed viewport height on feed,
post, profile, leaderboard, docs, and the quiz scoreboard: every
column's scrollTop reaches its true end independently, the center
column never moves, and no scrollbar is visible in any screenshot.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Vnp7vzE4hvsytMo5YjszJm
retoorandClaude Sonnet 5
d88b3cea8e