Re: [csswg-drafts] [specificity] Specifity of ::slotted() is greater than :host

I think I understand it a bit better now. I hadn't realised that the same occurs when you have an example like the following:

```html
<style>
h1 {
    color: green;
</style>
<app-container>
    <::shadow>
    <style>
        ::slotted(*) { color: red; }
    </style>
    </::shadow>
</app-container>
```

The output will be a green h1. It does make sense but it means that the only way for the custom element to change the colour the h1 is to use `!important` but if you do that you have no way of topping this.

There needs to be a way of achieving the same as below but without having to apply the styles outside the custom element.

```html
<style>
* {
    color: green;
}
app-container {
    color: red;
}
</style>

<!-- ... -->

<app-container>
    text will be red
</app-container>
```

-- 
GitHub Notification of comment by mindthetic
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2290#issuecomment-382430877 using your GitHub account

Received on Wednesday, 18 April 2018 15:37:24 UTC