Skip to content

[Repo Assist] Use scrollbar-gutter: stable on scroll containers#1088

Merged
dsyme merged 5 commits intomainfrom
repo-assist/fix-issue-1087-scrollbar-gutter-stable-c082a7bff89172f4
Mar 13, 2026
Merged

[Repo Assist] Use scrollbar-gutter: stable on scroll containers#1088
dsyme merged 5 commits intomainfrom
repo-assist/fix-issue-1087-scrollbar-gutter-stable-c082a7bff89172f4

Conversation

@github-actions
Copy link
Contributor

🤖 This is an automated PR from Repo Assist.

Closes #1087

What

Adds [scrollbar-gutter: stable]((developer.mozilla.org/redacted) (part of the [2024 Baseline]((web.dev/redacted) to all vertical-scroll containers in fsdocs-default.css.

Why

scrollbar-gutter: stable reserves the scrollbar track space even when the scrollbar isn't visible. Without it, layout shifts occur whenever a scroll container gains or loses a scrollbar — content reflows as the available width changes by ~15 px (the scrollbar width).

Changes

Element Change
main Added overflow-y: auto (bug fix — see below) + scrollbar-gutter: stable
#fsdocs-main-menu Added scrollbar-gutter: stable
Mobile .menu dropdown Added scrollbar-gutter: stable
dialog ul (search results) Added scrollbar-gutter: stable

Bug fix: missing overflow-y: auto on main

The global reset sets html { overflow-y: hidden }, which prevents the document viewport from scrolling. The intent is that main and #fsdocs-main-menu each scroll independently within the fixed-height layout. The sidebar already had overflow-y: auto; main was missing it, meaning long pages were clipped rather than scrollable at the main level. This PR adds it.

Browser support

scrollbar-gutter is [Baseline 2024]((caniuse.com/redacted) — supported in Chrome 94+, Firefox 97+, Safari 15.8+. All browsers from the 2024 baseline are covered.

Test Status

CSS-only change, no build or test failures expected. The project's test suite does not include visual/CSS regression tests.

Generated by Repo Assist for issue #1087 ·

To install this agentic workflow, run

gh aw add githubnext/agentics/workflows/repo-assist.md@346204513ecfa08b81566450d7d599556807389f

Add scrollbar-gutter: stable (Baseline 2024) to all vertical-scroll
containers to reserve scrollbar gutter space and prevent layout shifts:

- main: also adds missing overflow-y: auto so long pages are
  independently scrollable (html has overflow-y: hidden, so main
  must be its own scroll container)
- #fsdocs-main-menu: sidebar no longer reflows content when
  the scrollbar appears/disappears
- Mobile .menu dropdown: same benefit
- dialog ul (search results): prevents width shift when results
  exceed max-height

Closes #1087

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
@nojaf nojaf closed this Mar 11, 2026
@nojaf nojaf reopened this Mar 11, 2026
@nojaf nojaf requested a review from dsyme March 11, 2026 06:49
@nojaf nojaf marked this pull request as ready for review March 11, 2026 06:49
@nojaf
Copy link
Collaborator

nojaf commented Mar 13, 2026

/repo-assist can you bump the release notes so we have another alpha after this PR.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
@github-actions
Copy link
Contributor Author

Commit pushed: 89a59b0

Generated by Repo Assist

@nojaf
Copy link
Collaborator

nojaf commented Mar 13, 2026

@dsyme would like to release another alpha. Could I get your signature on this?

@dsyme dsyme merged commit 984ea30 into main Mar 13, 2026
4 checks passed
@dsyme dsyme deleted the repo-assist/fix-issue-1087-scrollbar-gutter-stable-c082a7bff89172f4 branch March 13, 2026 23:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

scrollbar-gutter: stable

2 participants