Re: [csswg-drafts] [scroll-animations-1] Do we need container-name references? (#7046)

I think that someone was me, in https://github.com/w3c/csswg-drafts/issues/6674#issuecomment-927378865

Adding an extra `*-name` property seemed a bit redundant:

```css
main { /* Identifier 1 */
  container-type: size;
  container-name: page-layout; /* Identifier 2 */
  scroll-timeline-direction: block;
  scroll-timeline-name: main-scroller: /* Identifier 3 */
}

.foo {
  animation-timeline: scroller; /* Identifier 3, again */
}
```

If more CSS concepts in the future require a `*-name` property, we could end up with 10 different _(or the same)_ values for all those `*-name` properties.

Adding `*-name` properties feels a bit weird as we already have a way to target elements built into CSS: selectors. Being a fan of the `selector()` function _(sorry 😬)_, I landed on this hypothetical piece of code:


```css
main { /* Identifier 1 */
  container-type: size;
  scroll-timeline-direction: block;
}

@container selector(main) (block-size > 12em) { /* Re-use Identifier 1 */
  /* … */
}

.foo {
  animation-timeline: selector(main); /* Re-use Identifier 1 */
}
```

In this approach the `selector()` function would act more `document.querySelector()`, accepting any selector – see https://github.com/w3c/csswg-drafts/issues/5884#issuecomment-867117769 for more details.

---

Now, I'm fine with not accepting a `container-name` inside `scroll()`, but do want to warn against having many `*-name` properties in the future as CSS grows and evolves.

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


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

Received on Thursday, 16 June 2022 14:15:12 UTC