940287 - Opacity on a td causes the border to render with the same color as the td background

Status: RESOLVED INVALID

(Core :: Layout: Tables, defect)

Description

[Jose Gayubas]

User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:25.0) Gecko/20100101 Firefox/25.0 (Beta/Release)
Build ID: 20131112160018

Steps to reproduce:

Table with td element with white border bottom and red background. When setting the opacity of that td to something between 0 and 1, the border changes to red with the opacity applied.

<table style="border-collapse: collapse">
            <tr>
                <td style="border-bottom: 2px solid white; background-color: black;opacity: 0.5">aaaaaaaaaaaaaaa</td>
            </tr>
            <tr>
                <td style="border-bottom: 2px solid white; background-color: black;opacity: 0.5">aaaaaaaaaaaaaaa</td>
            </tr>
        </table>


Actual results:

The border changes to red.


Expected results:

The border remains white.

Comment 1

[Mats Palmgren (inactive)]

Please upload a complete HTML file that demonstrates the problem (use the
"Add an attachment" link on the bug).  The snippet in the Description doesn't use
any red color.

Comment 2

[Jose Gayubas]

Attachment: html test case

Comment 3

[Jose Gayubas]

Attachment: image

Comment 4

[Mats Palmgren (inactive)]

Attachment: Testcase

Here's a clearer testcase that shows that we paint the background half-way
under the border and apply opacity to that area.  I think this is the
correct rendering.  IE10 on Win8 does the same.

Chrome 33 on Linux only paints the background to where the border starts
in the first cell.  That seems wrong, 'opacity' shouldn't affect the extent
of the background like that.  So I think this is just a bug in Chrome.

Comment 5

[Mats Palmgren (inactive)]

border-collapse tables are complicated though, Boris do you agree we render this correctly?

Comment 6

[Boris Zbarsky [:bzbarsky]]

Yes, I do.

Jose, please do report the bug to the Chrome folks!

Comment 7

[Mats Palmgren (inactive)]

(I've filed https://bugs.chromium.org/p/chromium/issues/detail?id=645613 )