Closed
Description
CSS Display defines blockification as such:
blockification [...] sets the box’s outer display type, if it is not none or contents, to block [...]
Some trivial examples:
- A flex item with
display: block
(i.e.block flow
) remainsblock flow
(and establishes a BFC). - A flex item with
display: inline
(i.e.inline flow
) becomesblock flow
(and establishes a BFC). - A flex item with
display: inline-block
(i.e.inline flow-root
) becomesblock flow-root
. - A flex item with
display: flow-root
(i.e.block flow-root
) remainsblock flow-root
. - A flex item with
display: table-cell
(i.e.table-cell flow-root
) becomesblock flow-root
.
Note: Edge generates anonymous table parents instead, according to an old Flexbox spec. - A flex item with
display: table
is especially defined in CSS Flexbox.
But now the interesting part:
- A flex item with
display: table-row
(i.e.table-row table-row
) becomesblock table-row
.
But this combination is not defined! How is it supposed to behave?
Firefox and Chrome seem to treat it like display: block
. Edge still generates an anonymous parent table. https://jsfiddle.net/sn6y4y0m/1/
I think CSS Display should say that, when a box is blockified, if its inner display type is layout-internal, then it becomes flow
or flow-root
.