Opacity does not apply on border of <td> if <table> has border-collapse:collapse
Reported by
matthieu...@gmail.com,
Dec 31 2017
|
||||||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/63.0.3239.84 Safari/537.36 Steps to reproduce the problem: https://codepen.io/anon/pen/wpdRwo What is the expected behavior? `opacity` should apply on borders if `background-clip: border-box` (default value) `background-clip` should give to the user the possibility to chose if `opacity` should affect borders or not What went wrong? the property `border-collapse: collapse` on a `<table>` element remove this behaviour Did this work before? No Does this work in other browsers? N/A Chrome version: 63.0.3239.84 Channel: stable OS Version: 10.0 Flash Version:
,
Jan 1 2018
,
Jan 1 2018
,
Jan 2 2018
,
Jan 2 2018
An issue with table collapsed border painting?
,
Jan 2 2018
It's not clear in the spec if td's opacity should apply on collapsed borders because collapsed borders are shared between cells and the painting is actually done as a phase of the table. Will check behavior of other browsers.
,
Jan 2 2018
Tried Firefox. It doesn't paint the border with opacity, meaning that it also treats collapsed borders as belonging to the table instead of individual cells. However, it paints the translucent background to be overlap with the border. This looks weird because if it's painting the cell background by filling the border-box, why doesn't it fill the border box when the cell doesn't have oapcity? Especially if the opacity is 0.999 and there are multiple cells, then only the outer halves of the outer border of the table are visible. Is this behavior stated in any spec? Also tried IE 11 on netrenderer, and the behavior is the same as Firefox. Anyone please try Edge? I don't have access to a windows machine for now.
,
Jan 2 2018
Edge looks the same as Firefox on https://codepen.io/anon/pen/wpdRwo.
,
Jan 2 2018
@wangxianzhu firefox & edge have the same default behavior but for both it's possible to control this with background-clip property when Chrome just ignore background-clip.
,
Jan 2 2018
I wonder the exact rule of background-clip for collapsed borders.
The current used values of background-clip when the table has collapsed-border of FireFox/Edge and Chrome are:
opacity:<1 opacity:1
Firefox/Edge specified padding-box
Chrome padding-box padding-box
It seems inconsisnent that Firefox/Edge has different behaviors based on opacity. Is there existing spec about the interaction of border-collapse, backgrounc-clip and opacity? I didn't find in https://www.w3.org/TR/css-backgrounds-3.
,
Jan 2 2018
Test case updated : https://codepen.io/anon/pen/wpdRwo Full of weird things. see attachments for the result (Windows 10 x64)
,
Jan 3
This issue has been Available for over a year. If it's no longer important or seems unlikely to be fixed, please consider closing it out. If it is important, please re-triage the issue. Sorry for the inconvenience if the bug really should have been left as Available. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Jan 3
I'm closing this bug because the spec is not clear, and the current chrome implementation seems reasonable consistent. |
||||||||
►
Sign in to add a comment |
||||||||
Comment 1 by sc00335...@techmahindra.com
, Jan 1 2018Components: Blink>Layout>Table
Labels: Triaged-ET M-65 Needs-Triage-M63 OS-Linux OS-Mac
Status: Untriaged (was: Unconfirmed)