Description
Compat Issues: Yes
Description:
Table-rows, Table-row-groups, Table-columns, and Table-column-groups are implemented in different ways in each browser.
Proposed option:
The proposal is to have them react to a small set of whitelisted-only css properties, describe the expected behavior of those properties, and make sure everything else is ignored by the browser. This will give browsers more freedom space to accommodate how they deal with those internally.
These elements would still generate a box, so you can ask their dimension using getBoundingClientRect. Whether table-cells are children of those boxes or not is left undefined by the spec, to leave more room for implementers.
Caveat: except in Firefox, table-columns currently do not generate a box
This whitelist currently includes width/height and background. Candidate additions would be opacity and transform, which would be applied on the cells themselves not on the table-track much like background is defined to work which is currently supported in every browser but Edge.
Ideally, table-row and table-column to work exactly the same way, to bring symmetry into this model. Any property that would make it impossible to achieve this goal should not be added to white list.
CSS 2.1 Option:
Undefined
Testcases:
https://jsfiddle.net/5um10zts/
https://jsfiddle.net/5um10zts/3/
Browsers Passing Test:
NA but the proposal unify quirks of both Blink/Webkit and EdgeHTML
Gecko has issues due to this (see the second testcase), like for instance they support position:relative on those elements.
Everyone agrees some things do not work, like overflow:hidden (otherwise spanned cells would be problematic).