Scoping doesn't work with css @container queries

gaoxiaoliangz / react-scoped-css

CSS encapsulation solution for React

456 stars 40 forks source link

Scoping doesn't work with css @container queries #95

Open Wiktor102 opened 4 months ago

Wiktor102 commented 4 months ago

The data attributes aren't added to CSS selectors inside an @container query. This effectively disables scoping for all styles applied within an @container rule. Take the following example: The above code only works because of the !important keyword.

Wiktor102 commented 4 months ago

This shortcoming causes specificity issues: the attribute selector has an additional (0, 1, 0) specificity. Refer to this example: