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.)