@@ -297,9 +297,24 @@ The multi-column model</h2>
297
297
</figure>
298
298
</div>
299
299
300
+ <wpt>
301
+ multicol-margin-001.xht
302
+ multicol-margin-002.xht
303
+ multicol-margin-child-001.xht
304
+ multicol-nested-margin-001.xht
305
+ multicol-nested-margin-002.xht
306
+ multicol-nested-margin-003.xht
307
+ multicol-nested-margin-004.xht
308
+ multicol-nested-margin-005.xht
309
+ </wpt>
310
+
300
311
Nested multi-column containers are allowed, but there may be
301
312
implementation-specific limits.
302
313
314
+ <wpt>
315
+ multicol-nested-002.xht
316
+ multicol-nested-005.xht
317
+ </wpt>
303
318
304
319
Note: It is not possible to set properties/values on column boxes. For
305
320
example, the background of a certain column box cannot be set and a
@@ -365,6 +380,7 @@ these two properties determine the outcome:-->
365
380
<wpt>
366
381
multicol-basic-003.html
367
382
multicol-basic-008.xht
383
+ multicol-reduce-000.xht
368
384
multicol-width-001.xht
369
385
multicol-width-002.xht
370
386
multicol-width-003.xht
@@ -373,6 +389,8 @@ these two properties determine the outcome:-->
373
389
multicol-width-invalid-001.xht
374
390
multicol-width-large-001.xht
375
391
multicol-width-large-002.xht
392
+ multicol-inherit-003.xht
393
+ multicol-list-item-001.xht
376
394
</wpt>
377
395
378
396
<div class="example">
@@ -460,6 +478,12 @@ these two properties determine the outcome:-->
460
478
multicol-count-non-integer-001.xht
461
479
multicol-count-non-integer-002.xht
462
480
multicol-count-non-integer-003.xht
481
+ multicol-inherit-001.xht
482
+ multicol-inherit-002.xht
483
+ multicol-table-cell-001.xht
484
+ multicol-table-cell-height-001.xht
485
+ multicol-table-cell-height-002.xht
486
+ multicol-table-cell-vertical-align-001.xht
463
487
</wpt>
464
488
465
489
<div class="example">
@@ -628,6 +652,10 @@ Stacking context</h3>
628
652
context and the drawing order of their contents is as specified in
629
653
CSS 2.1. Column boxes do not establish new stacking contexts.
630
654
655
+ <wpt>
656
+ multicol-rule-stacking-001.xht
657
+ </wpt>
658
+
631
659
<h2 id="column-gaps-and-rules">
632
660
Column gaps and rules</h2>
633
661
@@ -637,6 +665,11 @@ Column gaps and rules</h2>
637
665
is, column gaps will push apart content in adjacent columns (within
638
666
the same multicol container).
639
667
668
+ <wpt>
669
+ multicol-height-001.xht
670
+ multicol-nested-column-rule-001.xht
671
+ </wpt>
672
+
640
673
A column rule is drawn in the middle of the column gap with the
641
674
endpoints at opposing content edges of the multicol container. Column
642
675
rules do not take up space. That is, the presence or thickness of a
@@ -647,8 +680,13 @@ Column gaps and rules</h2>
647
680
only drawn between two columns that both have content.
648
681
649
682
<wpt>
683
+ multicol-rule-001.xht
684
+ multicol-rule-003.xht
685
+ multicol-rule-004.xht
650
686
multicol-count-computed-003.xht
651
687
multicol-count-computed-005.xht
688
+ multicol-rule-fraction-002.xht
689
+ multicol-rule-large-001.xht
652
690
</wpt>
653
691
654
692
<h3 id='cg'>
@@ -669,6 +707,11 @@ Column gaps and rules</h2>
669
707
multicol-gap-animation-001.html
670
708
multicol-gap-animation-002.html
671
709
multicol-gap-animation-003.html
710
+ multicol-gap-fraction-001.xht
711
+ multicol-gap-fraction-002.html
712
+ multicol-gap-large-001.xht
713
+ multicol-gap-large-002.xht
714
+ multicol-gap-negative-001.xht
672
715
</wpt>
673
716
674
717
<i> 'column-gap' accepting <<length-percentage>> is at risk,
@@ -723,6 +766,12 @@ Column gaps and rules</h2>
723
766
Specifies the color of the column rule.
724
767
</dl>
725
768
769
+ <wpt>
770
+ multicol-rule-color-001.xht
771
+ multicol-rule-color-inherit-001.xht
772
+ multicol-rule-color-inherit-002.xht
773
+ </wpt>
774
+
726
775
727
776
<h3 id='crs'>
728
777
'column-rule-style'</h3>
@@ -761,6 +810,11 @@ Column gaps and rules</h2>
761
810
This property sets the width of the rule between columns.
762
811
Negative values are not allowed.
763
812
813
+ <wpt>
814
+ multicol-rule-fraction-001.xht
815
+ multicol-rule-px-001.xht
816
+ multicol-rule-percent-001.xht
817
+ </wpt>
764
818
765
819
<h3 id="cr">
766
820
'column-rule'</h3>
@@ -782,7 +836,21 @@ Column gaps and rules</h2>
782
836
initial values.
783
837
784
838
<wpt>
839
+ multicol-shorthand-001.xht
840
+ multicol-rule-shorthand-001.xht
785
841
multicol-rule-shorthand-2.xht
842
+ multicol-rule-000.xht
843
+ multicol-rule-dashed-000.xht
844
+ multicol-rule-dotted-000.xht
845
+ multicol-rule-double-000.xht
846
+ multicol-rule-outset-000.xht
847
+ multicol-rule-none-000.xht
848
+ multicol-rule-hidden-000.xht
849
+ multicol-rule-inset-000.xht
850
+ multicol-rule-groove-000.xht
851
+ multicol-rule-ridge-000.xht
852
+ multicol-rule-solid-000.xht
853
+
786
854
</wpt>
787
855
788
856
<div class=example>
@@ -802,6 +870,10 @@ Column gaps and rules</h2>
802
870
<img src="images/rule-same-width-as-gap.svg" alt="The rule completely covers any gap.">
803
871
<figcaption> The column rule and column gap occupy the same space.</figcaption>
804
872
</figure>
873
+
874
+ <wpt>
875
+ multicol-rule-samelength-001.xht
876
+ </wpt>
805
877
</div>
806
878
807
879
@@ -819,6 +891,10 @@ Column breaks</h2>
819
891
described in the same properties as page breaks: 'break-before' ,
820
892
'break-after' , and 'break-inside' .
821
893
894
+ <wpt>
895
+ multicol-break-000.xht
896
+ </wpt>
897
+
822
898
823
899
<h3 id="break-before-break-after-break-inside">
824
900
'break-before', 'break-after', 'break-inside'</h3>
@@ -852,6 +928,10 @@ Spanning columns</h2>
852
928
<dd>
853
929
The element does not span multiple columns.
854
930
931
+ <wpt>
932
+ multicol-span-none-001.xht
933
+ </wpt>
934
+
855
935
<dt> <dfn>all</dfn>
856
936
<dd>
857
937
The element spans across all columns of the nearest multicol
@@ -867,6 +947,21 @@ Spanning columns</h2>
867
947
This helps with robustness of designs to later revisions
868
948
that remove the multicol,
869
949
or when media queries turn the multicol off in some situations.
950
+
951
+ <wpt>
952
+ multicol-span-000.xht
953
+ multicol-span-all-001.xht
954
+ multicol-span-all-003.xht
955
+ multicol-span-all-block-sibling-003.xht
956
+ multicol-span-all-margin-001.xht
957
+ multicol-span-all-margin-002.xht
958
+ multicol-span-all-margin-bottom-001.xht
959
+ multicol-span-all-margin-nested-001.xht
960
+ multicol-span-all-margin-nested-002.xht
961
+ multicol-span-all-margin-nested-firstchild-001.xht
962
+ multicol-span-float-001.xht
963
+ inline-block-and-column-span-all.html
964
+ </wpt>
870
965
</dl>
871
966
872
967
An element that spans more than one column is called a
@@ -890,6 +985,8 @@ Spanning columns</h2>
890
985
</figure>
891
986
</div>
892
987
988
+
989
+
893
990
A spanning element may be lower than the first level of descendants as long as they are part of the same formatting context. If the fragment before the spanner is empty, nothing special happens; the top margin/border/padding is above the spanning element, as an empty fragment.
894
991
895
992
<div class="example">
@@ -957,6 +1054,10 @@ h2 {
957
1054
</figure>
958
1055
</div>
959
1056
1057
+ <wpt>
1058
+ multicol-span-all-002.xht
1059
+ </wpt>
1060
+
960
1061
<div class="example">
961
1062
In fragmented contexts spanning elements are honored in all fragments.
962
1063
In this example, we are in paged media, and the first three paragraphs have column breaks after them.
@@ -1183,6 +1284,10 @@ Overflow inside multicol containers</h3>
1183
1284
</figure>
1184
1285
</div>
1185
1286
1287
+ <wpt>
1288
+ multicol-block-no-clip-001.xht
1289
+ </wpt>
1290
+
1186
1291
1187
1292
<h3 id="pagination-and-overflow-outside-multicol">
1188
1293
Pagination and overflow outside multicol containers</h3>
@@ -1210,6 +1315,11 @@ Pagination and overflow outside multicol containers</h3>
1210
1315
media.
1211
1316
</ul>
1212
1317
1318
+ <wpt>
1319
+ multicol-overflow-000.xht
1320
+ multicol-overflowing-001.xht
1321
+ </wpt>
1322
+
1213
1323
Columns that appear outside the multicol container in continuous contexts
1214
1324
are called <dfn export>overflow columns</dfn> . Overflow columns can effect the height of the multicol container.
1215
1325
0 commit comments