CSS Backgrounds and Borders

[stubbornella]

Description

There are various inconsistencies between browsers on how some kinds of borders and background render, and some newer features like background-clip: border-area/text that we should drive interop on. @smfr

This includes the following areas:

• CSS border property and longhands
• CSS border-image
• CSS backgrounds property and longhands

Specification

various

Additional Signals

No response

[gsnedders]

I believe we're proposing https://wpt.fyi/results/css?label=experimental&label=master&aligned&q=path%3A%2Fcss%2Fcss-backgrounds%20or%20path%3A%2Fcss%2Fcss-borders%20or%20path%3A%2Fcss%2FCSS2%2Fbackgrounds%20or%20path%3A%2Fcss%2FCSS2%2Fborders%20not%20is%3Atentative here? Note that this actually currently gives too many tests, due to web-platform-tests/wpt.fyi#4048.

[atjn]

This could potentially be bundled with these proposals:
#727
#713

[dholbert]

The proposed test list above includes this test:
https://wpt.fyi/results/css/css-borders/border-image-width-interpolation-math-functions.html

...which Firefox mostly fails, but not for any background/border-related reason; that's just a version of #867 where the test is doing something like sign(20rem - 20px).

[dholbert]

The proposed test list also includes this test:
https://wpt.fyi/results/css/css-borders/border-radius-greater-than-width.html
...which wpt.fyi shows Chrome/Firefox/Safari failing (and Edge passing). But if you click through to the "compare" view, it looks like all of the failures are just fuzzy mismatches along antialiased edges/curves. (This isn't entirely surprising, since the reference case uses clip-path to mock up a diagonal separator between two border colors, and there's no guarantee that this diagonal edge would get antialiased in exactly the same way between two adjacent border-sides vs. between overlapping diagonally-clipped elements.)

So: this test should be excluded from this focus area, since its failure is just a limitation of the test itself, and doesn't represent an actual interop issue. (Ideally the test should be adjusted to get a fuzzy allowance, or redesigned to avoid having this rendering difference in the first place; but that test fixup doesn't really need to happen as part of the interop effort.)

[wpt-interop]

Thank you for proposing CSS Backgrounds and Borders for inclusion in Interop 2025.

We wanted to let you know that this proposal was not selected to be part of Interop this year.

On behalf of the entire Interop team, thank you for submitting this proposal for consideration. We got many more proposals than we could include in this year's project, necessitating some difficult choices. Please note this should not be taken as a comment on the technology as a whole, or our willingness to consider it for Interop in the future. We appreciate the work you put into your proposal, and would welcome your participation in future rounds of Interop.

For an overview of our process, see proposal selection. Thank you again for contributing to Interop 2025.

Posted on behalf of the Interop team.