Skip to content

Custom Element shim incorrectly handles @host rule #65

Closed
@ebidel

Description

Originally from: https://github.com/toolkitchen/polyfills/issues/86


The shim treats @host as a pseduo element. Namely, the following example applies
a red border to the host, which changes to a blue one on hover:

<style>
@host {
 border: 1px solid red;
}
@host:hover {
   border: 1px solid blue;
}
<style>

But the @host at-rule is like a @media query. The example above should be written as:

<style>
@host {
  * {
   border: 1px solid red;
  }
  *:hover {
   border: 1px solid blue;
  }
}
<style>

The toolkit, shim, and examples use the first syntax everywhere. Is that intentional or am I out of whack here?

Metadata

Assignees

Labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions