#970: A layer attribute for layering of linked CSS style sheets in HTML

Visit on Github.

Opened Jun 18, 2024

こんにちは TAG-さん!

I'm requesting a TAG review of an HTML layer attribute for the <link> tag.

One of the primary use-cases for CSS Cascade Layering is to manage the priority of third-party CSS (libraries and design systems) in relation to site-specific styles. It's currently possible to manage this layering on the CSS @import rule, as defined in CSS Cascading and Inheritance Level 5. However, there are many situations where authors do not want to use @import for performance reasons, or cannot use @import because of build tooling. Providing this functionality on the HTML <link> tag would bring it in better alignment with the CSS import functionality.

There seems to be broad consensus on this aspect of the feature, and I wanted to get formal review in order to hopefully move the conversation forward.

  • Explainer¹ (minimally containing user needs and example code): https://css.oddbird.net/layers/link-layer/
  • Primary contacts (and their relationship to the specification):
    • Miriam Suzanne (@mirisuzanne), Invited Expert (explainer author & Cascade L5 co-editor)
    • Simon Pieters (@zcorpan), Mozilla (WHATWG contact)
    • Alan Stearns (@astearns), Adobe (CSSWG Co-Chair)
  • Organization/project driving the design: CSSWG/WHATWG
  • External status/issue trackers for this feature (publicly visible, e.g. Chrome Status): None yet

Further details:

Discussions

Discussed Sep 2, 2024 (See Github)

No progress to report.

Discussed Sep 9, 2024 (See Github)

let's bring to the plenary

Discussed Sep 16, 2024 (See Github)

Tristan: haven't had chance to look

Matthew: seems like a really big change

Yves: needs careful thinking

plenary with Lea

Discussed Oct 14, 2024 (See Github)

Lea: I have some qualms. <link> does a variety of things, some of which are CSS. It worries me that we keep adding things to this element that are only relevant to CSS. Not just layer. supports, scope, etc. Would these be better served by having an attribute that passes attributes to particular technologies. But the use cases are pervasive, and I don't want to block them. Not sure it's a great design, but it can move forward.

Jeffrey: I get the sense from WHATWG discussions that it's better to just add the attribute with a short name rather than inventing a microsyntax to scope it exactly right.

Peter: It also works on the <style> element, and we'd like <link> to be consistent. But maybe we want to do it in the linked thing?

Lea: Problem is that we've overloaded <link> too much, which we now have a design principle against. Should have been <style src>

Peter: How about the Link header?

Lea: Don't think it works for new things.

Jeffrey: Good comment to leave, that this should also work in the Link header.

<blockquote> We like this, and we're happy for the WHATWG to figure out the exact name and details. Our one concern is that the `Link` header should behave the same as the `<link>` element. </blockquote>

[After the meeting, Jeffrey discovered that Link: <>;rel=stylesheet isn't actually specified to work at all (https://html.spec.whatwg.org/multipage/links.html#table-link-relations), so there's no need to make it work for layer attributes.]

Resolution: satisfied:

<blockquote> We like this, and we're happy for the WHATWG to figure out the exact name and details. Thanks for working on it! </blockquote>
Comment by @jyasskin Oct 17, 2024 (See Github)

We discussed this in a breakout session with the conclusion that we like it, and we're happy for the WHATWG to figure out the exact name and details. Thanks for working on it!