Re: [csswg-drafts] [css-scoping-1] Specificity of :host, ::slotted, and :host-context doesn't seem to be defined? (#1915)

Here other example. You have some generic styles for headings, paragraph, etc.. to ensure your web looks fine.

I wants component called hero for the home page or a card to list products. The will have a heading inside. I could style this elements because of the generic selector styles.

```
<fancy-hero>
  <h1>My site is awesome</h1>
  <h2>It use Web Components</h2>
</fancy-hero>

<h2>My products</h2>

<ul>
  <li>
    <fancy-card>
      <h1>Product one</h1>
      <p>It use Web Components</p>
    </fancy-card>
  </li>
</ul>
```

Currently, you have to put important in all styles of your component that apply to avoid being apply to the elements inside your components.

If you try to upgrade a legacy proyecto with tons of css your components are very fragile. And `!important` solution gets very bad press among developers.

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


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Tuesday, 20 July 2021 13:58:53 UTC