[css-scrollbars-1] Make scrollbar-width inheritable

[xPaw]

We wanted to add custom scrollbar properties in our app, as these properties already shipped in Firefox, but realized an oddity.

scrollbar-color can be applied to body, and any child elements with a scrollbar will have the color applied, but this doesn't work on scrollbar-width and requires each scrollable element to have it defined separately.

I could not find any discussion on this.

[emilio]

I'm not sure this is desirable, you wouldn't want to make html { scrollbar-width: none } disable all scrollbars in the page.

[emilio]

cc @upsuper @tantek

[jonjohnjohnson]

What @emilio said, especially since this (less common) case is solved with a simple...

:where(:root) { scrollbar-width: none; }
:where(*)     { scrollbar-width: inherit; }

[upsuper]

All CSS properties are inheritable, via specifying property: inherit as mentioned by @jonjohnjohnson. The "inherited" field just means whether the property inherits by default.

Based on use case analysis mentioned in the spec, we consider scrollbar-color to serve the use cases for assigning kind of theme colors to scrollbars, which usually applies page-wise, so it is inherited by default, while scrollbar-width is for addressing cases where specific elements may be too small to show a full-width scrollbar, or elements that has custom scrollbar want to hide the default scrollbar, so it is not made inherited by default.

Given the usecases as well as the existence of "workaround" if you really want to inherit that property, I don't think we are going to take this change, so closing this PR.