You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: css-multicol-2/Overview.bs
+20-4Lines changed: 20 additions & 4 deletions
Original file line number
Diff line number
Diff line change
@@ -555,6 +555,8 @@ The multi-column model</h2>
555
555
the height of each column is defined by the 'column-height' property.
556
556
If there is more content than will fit in a single row a new multicol row is created
557
557
in the block direction, with columns of the size defined by the 'column-height' property.
558
+
If a row is only partially filled with content,
559
+
the size defined by 'column-height' is still maintained with empty space following the content.
558
560
559
561
When a <i>spanning element</i> divides the
560
562
multi-column container: a new multicol line is created.
@@ -568,9 +570,10 @@ The multi-column model</h2>
568
570
<figcaption>A demonstration of how the spanning element divides the multicol container.</figcaption>
569
571
</figure>
570
572
</div>
571
-
572
-
Issue(11976): This issue deals with the scenario where there is not enough space
573
-
in the current multicol row for a spanning element. Once resolved, add details here.
573
+
574
+
If the spanning element is larger in the block direction than the space available in the current multicol row,
575
+
the row geometry is maintained. The spanner is allowed to cross the row boundary,
576
+
over any gap, and into the next row.
574
577
575
578
A [=multi-column container=] therefore is a regular [=block container=]
576
579
that establishes a new [=independent formatting context=]
@@ -823,6 +826,13 @@ The number and size of columns</h2>
823
826
you may end up with some additional space.
824
827
The properties defined in the [[CSS-ALIGN]] specification detail how to deal with it.
825
828
829
+
When 'column-height' is not 'auto' the size in the block direction is not flexible.
830
+
If there is not enough content to fill a row of columns at the set size,
831
+
empty space is left.
832
+
833
+
If a spanner is introduced that is taller than the set size,
834
+
the row geometry will be maintained, and the spanner will overflow into the next row, crossing any 'row-gap'.
835
+
826
836
<h3 id='cc'>The Number of Columns: the 'column-count' property</h3>
827
837
828
838
<pre class=propdef>
@@ -1481,7 +1491,7 @@ Spanning columns</h2>
1481
1491
<dt><dfn>all</dfn></dt>
1482
1492
<dd>
1483
1493
The element forces a column break and is taken [=out of flow=]
1484
-
to span across all columns of the nearest multicol ancestor
1494
+
to span across all columns of the current multicol row
1485
1495
in the same [=block formatting context=].
1486
1496
Content in the normal flow that appears before the element
1487
1497
is automatically balanced across all columns
@@ -2288,6 +2298,12 @@ This appendix is <em>informative</em>.
2288
2298
<h3 id="changes-from-multicol1">Changes from the <a href="https://www.w3.org/TR/2024/CR-css-multicol-1-20240516/">Candidate Recommendation (CR) of CSS-MULTICOL-1 of 16 May 2024</a></h3>
2289
2299
2290
2300
<ul>
2301
+
<li>Defines that the size of the columns in the block direction is maintained when 'column-height' is set, even if there's not enough content to fill a row.
2302
+
<a href="https://github.com/w3c/csswg-drafts/issues/11976#issuecomment-3206088562">Resolved 20 August 2025</a></li>
2303
+
<li>Defines that spanners only span the current row of columns when wrapping.
2304
+
<a href="https://github.com/w3c/csswg-drafts/issues/11976#issuecomment-3206088562">Resolved 20 August 2025</a></li>
2305
+
<li>Defines what happens when a spanner is larger than the available space in the block direction.
2306
+
<a href="https://github.com/w3c/csswg-drafts/issues/11976#issuecomment-3206088562">Resolved 20 August 2025</a></li>
2291
2307
<li>Updates the ''columns'' shorthand property to include ''column-height''. <a href="https://github.com/w3c/csswg-drafts/issues/12050#issuecomment-3160860557">Resolved 6 Aug 2025</a>.
2292
2308
<li>Adds a draft of proposed ''column-wrap'' property.</li>
2293
2309
<li>Adds the ''column-height'' property. <a href="https://github.com/w3c/csswg-drafts/issues/2923#issuecomment-2625930018">Resolved 30 Jan 2025</a>.
0 commit comments