- From: Ryosuke Niwa via GitHub <sysbot+gh@w3.org>
- Date: Mon, 18 Mar 2019 20:11:50 +0000
- To: public-css-archive@w3.org
> If the outer page has a `@font-face` declaring a "foo" family, and sets `body { font-family: foo; }`, then a component declares its own "foo" `@font-face` but doesn't immediately use it, inheritance will still carry the `font-family: foo` declaration into the shadow.
What are use cases for which components declare `@font-face` and not use it?
> With recursive search, as this declaration crosses the shadow boundary, it will suddenly start referencing the inner "foo" `@font-face`, which is completely unexpected.
Is it? This seems to be the same issue as other kinds of inheritance. If someone declares a CSS variable in the outer tree and the component also defines its own CSS variable, they would collide. But we didn't think that's not an issue. Why is this case so special?
> It means that shadows aren't encapsulated from the outer page; if they declare a font-family that happens to have the same name as one the outer page uses, it'll suddenly break the display of the component. The same applies to every other inheritable reference; it means an inherited `fill: url(#foo)` will break if the shadow happens to have an element with the same ID, etc.
It does seem to me that fragment identifier would always have to be resolved against the tree in which the declaration first appeared.
--
GitHub Notification of comment by rniwa
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/1995#issuecomment-474081788 using your GitHub account
Received on Monday, 18 March 2019 20:11:52 UTC