Skip to content

[css-display][css-flexbox] Blockification of layout-internal type #1340

Description

@Loirooriol

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) remains block flow (and establishes a BFC).
  • A flex item with display: inline (i.e. inline flow) becomes block flow (and establishes a BFC).
  • A flex item with display: inline-block (i.e. inline flow-root) becomes block flow-root.
  • A flex item with display: flow-root (i.e. block flow-root) remains block flow-root.
  • A flex item with display: table-cell (i.e. table-cell flow-root) becomes block 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) becomes block 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.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions