The scrollbar-gutter CSS property allows authors to reserve the space for the scrollbar placed at the inline edges, preventing unwanted layout changes when the content grows and overflows the scroll container. Note that scrollbar-gutter only has an effect when the OS uses "classic" scrollbar. The overlay scrollbar (i.e. macOS default scrollbar style when using the touchpad) doesn't occupy the space at all.
I intend to turn on the support of scrollbar-gutter by default on Firefox 97. Bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1715112 Standard: https://drafts.csswg.org/css-overflow/#scrollbar-gutter-property The spec has a nice table summarizing the interaction of "overflow" and "scrollbar-gutter" properties. Platform coverage: All platforms. Preference: layout.css.scrollbar-gutter.enabled DevTools bug: This feature doesn't require extra work in DevTools. Other browsers: Google Chrome shipped scrollbar-gutter in version 94 in September 2021. https://chromestatus.com/features/5746559209701376 Apple Safari has no sign of the implementation yet. https://bugs.webkit.org/show_bug.cgi?id=167335 web-platform-tests: https://wpt.fyi/results/css/css-overflow?label=master&label=experimental&aligned&q=scrollbar-gutter Additional wpt tests are added in Bug 1715112. Thanks, Ting-Yu Lin -- You received this message because you are subscribed to the Google Groups "dev-platform@mozilla.org" group. To unsubscribe from this group and stop receiving emails from it, send an email to dev-platform+unsubscr...@mozilla.org. To view this discussion on the web visit https://groups.google.com/a/mozilla.org/d/msgid/dev-platform/CALa%3Diquxw5NVCtvMnBB5Q33zDcBn6y1VqnQv0X8O8q_aKQ5sCw%40mail.gmail.com.
