scrollbar-width CSS Property

[lukewarlow]

Request for position on an emerging web specification

(Please delete inapplicable rows.)

• WebKittens who can provide input:

Information about the specification

• Title: CSS Scrollbars Styling Level 1
• URL: https://www.w3.org/TR/css-scrollbars-1/#scrollbar-width
• GitHub repository: https://github.com/w3c/csswg-drafts/tree/main/css-scrollbars-1

Design reviews and vendor positions

• TAG Design Review: CSS Scrollbars: scrollbar-color, scrollbar-width w3ctag/design-reviews#563

Mozilla are the only ones who have implemented this property so far. (Chromium has a WIP implementation)

Bugs tracking this feature

• WebKit Bugzilla: https://bugs.webkit.org/show_bug.cgi?id=231588
• Radar: rdar://84417387

Anything else we need to know

Currently to hide scrollbars in WebKit you need to use the legacy ::-webkit-scrollbar pseudo styling. This property would allow hiding scrollbars through a standard property.

[hober]

@smfr, thoughts?

[karlcow]

seeAlso whatwg/compat#61

[lukewarlow]

To add more information to this issue. This property supports three values, auto, thin and none. These match nicely to WebKit's ScrollbarControlSize::Regular and ScrollbarControlSize::Thin and not rendering the scrollbar.

With always on scrollbars these render like below:

With overlay scrollbars these render like below (these only show when scrolling as expected):

[smfr]

WebKit supports the proposal. We will mark as Support one week from now, pending objections.