Re: [csswg-drafts] [css-background-4] add background-layers property to set everything but background-color (#8726)

I don't think it can be a keyword, or be part of the value in general.
That's because shorthand expansion happens at parse time, but the value may not be known until computed-value time due to `var()`, so by then it's too late to decide whether a longhand should be part of the shorthand expansion or not.
Well, maybe it could work with a magical `ignore` (#5319) that skips that declaration and rolls back to the next winner of the cascade, but I'm not sure if that's doable.

Another idea could be using #8055, though you would still need to list the longhands once, an ugly universal selector, and a roundabout of setting via variables:

```css
* {
  background-position: from-shorthand(background: var(--background));
  background-repeat: from-shorthand(background: var(--background));
  background-attachment: from-shorthand(background: var(--background));
  background-image: from-shorthand(background: var(--background));
  background-size: from-shorthand(background: var(--background));
  background-origin: from-shorthand(background: var(--background));
  background-clip: from-shorthand(background: var(--background));
}
.foo { --background: url('foo.png') content-box no-repeat; }
.bar { --background: url('bar.png') 10px 20px no-repeat; }
```

However, I think the best solution (and already works in browsers!) would be setting the full `background` shorthand inside a layer, and then reverting `background-color` to the previous layer:

```css
@layer {
  .foo { background: url('foo.png') content-box no-repeat; background-color: revert-layer }
  .bar { background: url('bar.png') 10px 20px no-repeat; background-color: revert-layer }
}
```

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


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

Received on Saturday, 27 May 2023 14:59:12 UTC