[css2][css-tables] Cells spanning collapsed track #11799
Description
https://drafts.csswg.org/css2/#dynamic-effects
Contents of spanned rows and columns that intersect the collapsed column or row are clipped.
How exactly are they clipped? If for example I have a cell with text "A B C" spanning 3 columns, roughly each letter on a column, and the middle column is collapsed, am I supposed to see "A C"? Or clip at the end like "A B"?
The L3 spec isn't much clear either: https://drafts.csswg.org/css-tables/#visibility-collapse-track-rendering
When a table-track or table-track-group has visibility: collapse, all the backgrounds, borders or outlines that are contributed by the cells within the given table-track or table-track-group will continue to be painted on cells that have not been fully collapsed (because they spanned multiple tracks).
Here I have a more complete testcase:
<!DOCTYPE html>
<table border>
<col></col>
<col></col>
<col style="visibility: collapse"></col>
<col></col>
<col></col>
<tr>
<td>A1</td>
<td>A2</td>
<td>A3</td>
<td>A4</td>
<td>A5</td>
</tr>
<tr>
<td>B1</td>
<td colspan="3" rowspan="3">B2 B3 B4<br>C2 C3 C4<br>D2 D3 D4</td>
<td>B5</td>
</tr>
<tr style="visibility: collapse">
<td>C1</td>
<td>C5</td>
</tr>
<tr>
<td>D1</td>
<td>D5</td>
</tr>
<tr>
<td>E1</td>
<td>E2</td>
<td>E3</td>
<td>E4</td>
<td>E5</td>
</tr>
</table>| Gecko | Blink | Servo | |
|---|---|---|---|
No browser clips spanning cells at all!
Blink shrinks the cell by the collapsed tracks, lays out again the contents of the cell into the new width, and then aligns vertically into the new height.
Gecko shrinks the cell but doesn't lay out the contents again. The vertical alignment is also done before shrinking the height (this implies that vertical-align: center can insert some space at the top, even if the contents are overflowing at the bottom).
Like Gecko, Servo doesn't lay out the contents again. But vertical alignment is done after shrinking the height (safely as per #12220).