[css-multicol] Should column-span:all inside a transform really become a spanner? #6805

mstensho · 2021-11-09T09:37:59Z

https://drafts.csswg.org/css-multicol/#spanning-columns

In order to become a spanner, we just require that the column-span:all element otherwise participate in the formatting context established by the multicol container / columns.

#elm becomes a spanner here:

<div style="columns:2;">
  <div>
    <div id="elm" style="column-span:all;">

#elm does NOT become a spanner here:

<div style="columns:2;">
  <div style="display:flow-root;">
    <div id="elm" style="column-span:all;">

But what about this one:

<div style="columns:2;">
  <div style="transform:rotate(45deg);">
    <div id="elm" style="column-span:all;">

A transform root establishes a containing block for all descendants, according to https://drafts.csswg.org/css-transforms/#transform-rendering :

For elements whose layout is governed by the CSS box model, any value other than none for the transform property also causes the element to establish a containing block for all descendants.

It does seem strange to allow a column spanner to escape a containing block established by a transform ancestor. Yet, here's what the multicol spec says:

The containing block of the spanner is the multicol container itself. Consequently, in cases where the spanner itself does not establish a containing block for absolutely positioned boxes inside the spanner, their containing block chain skips directly to the multicol container (skipping any ancestors between the spanner and the multicol container).

Could we just change the multicol spec to require that there's nothing in the ancestry between the spanner candidate and the multicol container that establishes a containing block for fixed-positioned descendants? That would guard against transforms and filters (anything else?). Paint and layout containment are already fine, as they trigger creation of a new formatting context.

A transform establishes a containing block for "everything", including fixed-positioned descendants. Letting spanners escape this seems strange, and it causes trouble for accessibility in our implementation. See w3c/csswg-drafts#6805 Bug: 1267847, 1225860 Change-Id: Ibcf9af327824a4683d4b33935c3bc28abe61f998

A transform establishes a containing block for "everything", including fixed-positioned descendants. Letting spanners escape this seems strange, and it causes trouble for accessibility in our implementation. See w3c/csswg-drafts#6805 Bug: 1267847, 1225860 Change-Id: Ibcf9af327824a4683d4b33935c3bc28abe61f998 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3310883 Reviewed-by: Alison Maher <almaher@microsoft.com> Commit-Queue: Morten Stenshorne <mstensho@chromium.org> Cr-Commit-Position: refs/heads/main@{#947905}

A transform establishes a containing block for "everything", including fixed-positioned descendants. Letting spanners escape this seems strange, and it causes trouble for accessibility in our implementation. See w3c/csswg-drafts#6805 Bug: 1267847, 1225860 Change-Id: Ibcf9af327824a4683d4b33935c3bc28abe61f998 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3310883 Reviewed-by: Alison Maher <almaher@microsoft.com> Commit-Queue: Morten Stenshorne <mstensho@chromium.org> Cr-Commit-Position: refs/heads/main@{#947905}

…forms., a=testonly Automatic update from web-platform-tests Don't allow column spanners inside transforms. A transform establishes a containing block for "everything", including fixed-positioned descendants. Letting spanners escape this seems strange, and it causes trouble for accessibility in our implementation. See w3c/csswg-drafts#6805 Bug: 1267847, 1225860 Change-Id: Ibcf9af327824a4683d4b33935c3bc28abe61f998 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3310883 Reviewed-by: Alison Maher <almaher@microsoft.com> Commit-Queue: Morten Stenshorne <mstensho@chromium.org> Cr-Commit-Position: refs/heads/main@{#947905} -- wpt-commits: 2c24e016032affc72eac0af31abea509a2c2e194 wpt-pr: 31837

css-meeting-bot · 2022-03-09T17:11:29Z

The CSS Working Group just discussed CSS MultiCol, and agreed to the following:

RESOLVED: Accept proposal that elements which establish fixedpos containing block also block descendant spanners

The full IRC log of that discussion

<fantasai> Topic: CSS MultiCol
<fantasai> github: https://github.com//issues/6805
<fantasai> alisonmaher: Criteria of becomming a spanner, specifically in case of a transform
<fantasai> alisonmaher: According to spec, can become a spanner if in the same formatting context
<fantasai> alisonmaher: even if inside a transformed ancestor
<fantasai> alisonmaher: because transform doesn't establish a new formatting context
<fantasai> alisonmaher:even though transforms trap fixed pos descendants
<fantasai> alisonmaher: Proposal is that anything that establishes a fixedpos containing block also prevents descendants from becoming a spanner
<rachelandrew> q+
<TabAtkins> +1
<astearns> ack rachelandrew
<fantasai> dbaron: Sgtm
<fantasai> rachelandrew: It seems like a sensible proposal, happy to make the edits
<fantasai> astearns: Anyone with concerns?
<fantasai> [silence]
<fantasai> astearns: Any objections?
<fantasai> RESOLVED: Accept proposal that elements which establish fixedpos containing block also block descendant spanners

Add <link rel="match"> tag to the test so that it runs and remove the .tentative identifier since the change has been approved by the CSSWG[1]. [1] w3c/csswg-drafts#6805 (comment) Bug: 1267847 Change-Id: I40d8017e79a8ab7f0bd40a8d704558afdcdca162

Add <link rel="match"> tag to the test so that it runs and remove the .tentative identifier since the change has been approved by the CSSWG[1]. [1] w3c/csswg-drafts#6805 (comment) Bug: 1267847 Change-Id: I40d8017e79a8ab7f0bd40a8d704558afdcdca162 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3514895 Commit-Queue: Alison Maher <almaher@microsoft.com> Auto-Submit: Alison Maher <almaher@microsoft.com> Reviewed-by: Morten Stenshorne <mstensho@chromium.org> Commit-Queue: Morten Stenshorne <mstensho@chromium.org> Cr-Commit-Position: refs/heads/main@{#979467}

Add <link rel="match"> tag to the test so that it runs and remove the .tentative identifier since the change has been approved by the CSSWG[1]. [1] w3c/csswg-drafts#6805 (comment) Bug: 1267847 Change-Id: I40d8017e79a8ab7f0bd40a8d704558afdcdca162 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3514895 Commit-Queue: Alison Maher <almaher@microsoft.com> Auto-Submit: Alison Maher <almaher@microsoft.com> Reviewed-by: Morten Stenshorne <mstensho@chromium.org> Commit-Queue: Morten Stenshorne <mstensho@chromium.org> Cr-Commit-Position: refs/heads/main@{#979467}

…tonly Automatic update from web-platform-tests Update multicol-span-all-017.html Add <link rel="match"> tag to the test so that it runs and remove the .tentative identifier since the change has been approved by the CSSWG[1]. [1] w3c/csswg-drafts#6805 (comment) Bug: 1267847 Change-Id: I40d8017e79a8ab7f0bd40a8d704558afdcdca162 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3514895 Commit-Queue: Alison Maher <almaher@microsoft.com> Auto-Submit: Alison Maher <almaher@microsoft.com> Reviewed-by: Morten Stenshorne <mstensho@chromium.org> Commit-Queue: Morten Stenshorne <mstensho@chromium.org> Cr-Commit-Position: refs/heads/main@{#979467} -- wpt-commits: 4265a339baf9bdccd9f1856a0010388ba834b616 wpt-pr: 33137

A transform establishes a containing block for "everything", including fixed-positioned descendants. Letting spanners escape this seems strange, and it causes trouble for accessibility in our implementation. See w3c/csswg-drafts#6805 Bug: 1267847, 1225860 Change-Id: Ibcf9af327824a4683d4b33935c3bc28abe61f998 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3310883 Reviewed-by: Alison Maher <almaher@microsoft.com> Commit-Queue: Morten Stenshorne <mstensho@chromium.org> Cr-Commit-Position: refs/heads/main@{#947905} NOKEYCHECK=True GitOrigin-RevId: a1747039c553177e3c2c79bc1747d31c40dbf767

Add <link rel="match"> tag to the test so that it runs and remove the .tentative identifier since the change has been approved by the CSSWG[1]. [1] w3c/csswg-drafts#6805 (comment) Bug: 1267847 Change-Id: I40d8017e79a8ab7f0bd40a8d704558afdcdca162 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3514895 Commit-Queue: Alison Maher <almaher@microsoft.com> Auto-Submit: Alison Maher <almaher@microsoft.com> Reviewed-by: Morten Stenshorne <mstensho@chromium.org> Commit-Queue: Morten Stenshorne <mstensho@chromium.org> Cr-Commit-Position: refs/heads/main@{#979467} NOKEYCHECK=True GitOrigin-RevId: de64f8911c7f0ee24ecfdaf732f5bd2633aab344

fantasai added the css-multicol-1 Current Work label Nov 10, 2021

chromium-wpt-export-bot mentioned this issue Dec 2, 2021

Don't allow column spanners inside transforms. web-platform-tests/wpt#31837

Merged

alisonmaher added the Agenda+ label Dec 2, 2021

rachelandrew self-assigned this Mar 9, 2022

rachelandrew added the Needs Edits label Mar 9, 2022

css-meeting-bot removed the Agenda+ label Mar 9, 2022

mozilla-apprentice mentioned this issue Mar 9, 2022

[css-multicol] Should column-span:all inside a transform really become a spanner? mozilla/wg-decisions#754

Closed

chromium-wpt-export-bot mentioned this issue Mar 9, 2022

Update multicol-span-all-017.html web-platform-tests/wpt#33137

Merged

rachelandrew closed this as completed in 09e30bd Jun 18, 2022

frivoal removed the Needs Edits label Jun 17, 2024

github-project-automation bot added this to css-multicol-1 Aug 26, 2024

github-project-automation bot moved this to Done in css-multicol-1 Aug 26, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[css-multicol] Should column-span:all inside a transform really become a spanner? #6805

[css-multicol] Should column-span:all inside a transform really become a spanner? #6805

mstensho commented Nov 9, 2021

css-meeting-bot commented Mar 9, 2022 •

edited by svgeesus

Loading

[css-multicol] Should column-span:all inside a transform really become a spanner? #6805

[css-multicol] Should column-span:all inside a transform really become a spanner? #6805

Comments

mstensho commented Nov 9, 2021

css-meeting-bot commented Mar 9, 2022 • edited by svgeesus Loading

css-meeting-bot commented Mar 9, 2022 •

edited by svgeesus

Loading