W3C home > Mailing lists > Public > public-css-archive@w3.org > October 2019

[csswg-drafts] [css-tables-3] Tall cell height redistribution algorithm (#4418)

From: Aleksandar Totic via GitHub <sysbot+gh@w3.org>
Date: Mon, 14 Oct 2019 23:21:01 +0000
To: public-css-archive@w3.org
Message-ID: <issues.opened-506919673-1571095260-sysbot+gh@w3.org>
atotic has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-tables-3] Tall cell height redistribution algorithm ==
I am reimplementing tables in Chrome. Height redistribution algorithm for tall cells  
(rowspan > 1)  is not fully defined in current spec.
I've investigated what Chrome and other browsers currently do. Every browser does something different. It'd be nice to spec a web compatible  algorithm, so that implementations can converge.

I expect row group and table height redistribution algorithms to be similar.

Based upon Chrome's behavior, I came up with a following algorithm.

## Algorithm

1) Compute row groups.
    * Group1 are rows shorter than intrinsic height. These are percentage
    heights, as row layout algorithm (first pass) has already added fixed heights to row height.
    * Group2 are unconstrained cells.
    * Group3 are all cells.

1) If there are any rows in Group1, distribute excess heights until rows
    reach their existing height. Distribution of heights is not proportional
    to %ge (like columns). It is greedy. Cells are traversed, and each cell
    is resized to its desired %ge height. When we run out of excess height,
    distribution stops.
    Example:
    &lt;tr height:100%> // this row gets all the excess height, because it is 100%.
    &lt;tr height:100%> // this row gets nothing, because there is nothing left

 2) If there is excess height left over distribute to Group2, or Group3 if
    Group2 is empty. Zero-height rows do not grow. Excess height is distributed in
    proportion to existing cell size.

Current spec:
https://drafts.csswg.org/css-tables-3/#height-distribution-principles
https://drafts.csswg.org/css-tables-3/#row-layout

I also have a w-p-t tentative testcase 
computing-row-measure-2.tentative.html

Chrome passes (I modeled the algorithm on Chrome's behavior)

PASS Unconstrained cells heights are distributed proportionally.
PASS Constrained fixed cells not resized if unconstrained exist.
PASS Constrained %ge cells grow to %ge size, but no more.
PASS %ge grow greedily.
PASS Zero height rows do not grow.
PASS Unconstrained cells are redistributed proportionally

Firefox has trouble with growing %ge cells:

FAIL Constrained %ge cells grow to %ge size, but no more. expected 30 but got 19
FAIL %ge grow greedily. assert_equals: expected 60 but got 19

Safari, like FF, does not like to grow %ge cells. I am unclear how Safari decides on which cell to grow.

FAIL Unconstrained cells heights are distributed proportionally. assert_equals: expected 50 but got 18
FAIL Constrained %ge cells grow to %ge size, but no more. assert_equals: expected 30 but got 18
FAIL %ge grow greedily. assert_equals: expected 60 but got 18
FAIL Unconstrained cells are redistributed proportionally assert_equals: expected 75 but got 30

Edge 17: Edge grows %ge cells beyond its intrinsic height, and does not grow greedily.

FAIL Constrained fixed cells not resized if unconstrained exist. expected 30, got 62
FAIL Constrained %ge cells grow to %ge size, but no more. expected 30, got 50
FAIL %ge grow greedily. expected 60, got 33

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4418 using your GitHub account
Received on Monday, 14 October 2019 23:21:03 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:41:54 UTC