Re: [csswg-drafts] [css-backgrounds] background-clip: border-area (#9456)

Updated the pen (https://codepen.io/jsnkuhn/pen/OJeoapM) with a second element using the `background` shorthand for comparison. The only difference from above is the inclusion of the `background-origin` on the gradient which seems to be needed in most cases: 

```css
@supports (background-clip: border-area) {
  .dqx {
      border-color: transparent;
      background-image:
        linear-gradient(to right, var(--border-color-highlight), var(--border-color-primary) 10% 90%, var(--border-color-highlight)), 
        none;
      background-origin: border-box;
      background-clip: border-area, border-box;
    }

  .dqx-shorthand {
      border-color: transparent;
      background:
        linear-gradient(to right, var(--border-color-highlight), var(--border-color-primary) 10% 90%, var(--border-color-highlight)) border-box border-area, 
        #000;
    }
}
```

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


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

Received on Monday, 2 September 2024 12:39:32 UTC