W3C home > Mailing lists > Public > public-css-archive@w3.org > July 2021

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

From: Jorge del Casar via GitHub <sysbot+gh@w3.org>
Date: Tue, 20 Jul 2021 13:58:51 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-883416456-1626789530-sysbot+gh@w3.org>
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

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:42:39 UTC