Bug 36103 – Using RGBa for border when box background is a gradient gives uneven coloring

• Status: RESOLVED
• Resolution: DUPLICATE
• Component: CSS

[Oli Studholme]

an alpha-transparent border should be applied uniformly even when the object’s background is a gradient. In Webkit the top and bottom borders are alpha-transparency of the parent object, but the left and right borders are alpha-transparency of the object’s gradient background.

[Oli Studholme]

It seems there are a bunch of border issues, with this bug being an overview of many of them:
https://bugs.webkit.org/show_bug.cgi?id=21835

[Philippe Wittenbergh]

Fx 3.6/ Gecko 1.9.2 is fairly buggy in this, still (in short, rendering of the linked testcase is incorrect as well - the gradient should repeat into the border edge and affect the color of the border). That is fixed on Gecko trunk.
See https://bugzilla.mozilla.org/show_bug.cgi?id=538909

[Philippe Wittenbergh]

Created attachment 50689 [details]
test case

Note also that the linked test case doesn't apply the same gradient for Gecko and WebKit (the WebKit gradient has repeat-x, the Gecko one has 'repeat' - the default).
Attached testcase corrects this (and the rendering is identical in Gecko 1.9.3a latest nightly and WebKit latest nightly, with the exception of the corners.

[Oli Studholme]

Thanks for adding the extra information Philippe, and for uploading a corrected test case. I’ve also added repeat-x to my test case

[Simon Fraser (smfr)]

*** This bug has been marked as a duplicate of bug 21835 ***