Chapter 10. Shadow CSS rough edges

This chapter covers

  • The widely unsupported :host-context() selector
  • The deprecated ::shadow and /deep/ Shadow DOM CSS selectors
  • CSS Variables
  • Polyfilling the Shadow DOM
  • Design systems

In the last two chapters, I painted a fairly rosy picture of the Shadow DOM. Don’t worry, I won’t take it back! As amazing as the Shadow DOM is, though, there are some caveats you should know about. Unfortunately, these caveats are likely the most confusing part of Web Components. Between deprecated features, features that lack support in certain browsers, or just needing to know how to navigate browsers that don’t support the Shadow DOM at all, it can all be a bit tricky.

10.1. Contextual CSS

The first rough edge to get ...

Get Web Components in Action now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial