@@ -173,8 +173,8 @@ Introduction</h2>
173173<h2 id="the-multi-column-model">
174174The multi-column model</h2>
175175
176- A <dfn lt="multi-column element |multicol element " export>multi-column element </dfn>
177- (or <em> multicol element </em> for short)
176+ A <dfn lt="multi-column container |multicol container " export>multi-column container </dfn>
177+ (or <em> multicol container </em> for short)
178178 is an element whose 'column-width' or 'column-count'
179179 property is not ''column-width/auto'' and therefore acts as a container for
180180 multi-column layout.
@@ -183,29 +183,29 @@ The multi-column model</h2>
183183 flowed into the content box of the corresponding element. Multi-column
184184 layout introduces a new type of container between the content box and
185185 the content, namely the <dfn>column box</dfn> (or <em> column</em> for
186- short). The content of a multicol element is flowed into its column
186+ short). The content of a multicol container is flowed into its column
187187 boxes.
188188
189- Column boxes in a multi-column element are arranged
189+ Column boxes in a multi-column container are arranged
190190 into <em> rows</em> . Like table cells, the column boxes in a row are
191- ordered in the inline direction of the multicol element . The
191+ ordered in the inline direction of the multicol container . The
192192 <em> column width</em> is the length of the column box in the inline
193193 direction. The <em> column height</em> is the length of the column box
194194 in the block direction. All column boxes in a row have the same column width, and all
195- column boxes in a row have the same column height. Within each row in the multi-column element ,
195+ column boxes in a row have the same column height. Within each row in the multi-column container ,
196196 adjacent column boxes are separated by a <em> column gap</em> , which
197197 may contain a <em> column rule</em> . All column gaps in the same row
198198 are equal. All column rules in the same row are also equal, if they
199199 appear; column rules only appear between columns that both have
200200 content.
201201
202- In the simplest case a multicol element will contain only one row
202+ In the simplest case a multicol container will contain only one row
203203 of columns, and the height of each column will be equivalent to the
204- used height of the multi-column element 's content box.
204+ used height of the multi-column container 's content box.
205205
206206 <div class="example">
207207 Column gaps (yellow) and column rules (green) are shown in this
208- sample rendition of a multi-column element with padding (blue). The
208+ sample rendition of a multi-column container with padding (blue). The
209209 blue and yellow is present for illustrational purposes only. In actual
210210 implementations these areas will be determined by the background.
211211
@@ -258,12 +258,12 @@ The multi-column model</h2>
258258 </div>
259259 </div>
260260
261- If the multi-column element is paginated, the height of each row is
261+ If the multi-column container is paginated, the height of each row is
262262 constrained by the page and the content continues in a new row of
263263 column boxes on the next page; a column box never splits across pages.
264264
265265 The same effect occurs when a <em> spanning element</em> divides the
266- multi-column element : the columns before the spanning element are
266+ multi-column container : the columns before the spanning element are
267267 balanced and shortened to fit their content. Content after the
268268 spanning element then flows into a new row of column boxes.
269269
@@ -463,14 +463,14 @@ The multi-column model</h2>
463463 The black box represents the image.
464464 </div>
465465
466- A multi-column element establishes a new block formatting context,
466+ A multi-column container establishes a new block formatting context,
467467 as per CSS 2.1 section 9.4.1.
468468
469469 <div class="example">
470- A top margin set on the first child element of a multicol element will not collapse with the margins of the multicol element .
470+ A top margin set on the first child element of a multicol container will not collapse with the margins of the multicol container .
471471 </div>
472472
473- Nested multi-column elements are allowed, but there may be
473+ Nested multi-column containers are allowed, but there may be
474474 implementation-specific limits.
475475
476476
@@ -480,7 +480,7 @@ The multi-column model</h2>
480480 functionality. For example, columns of different widths and different
481481 backgrounds may be supported.
482482
483- Note: Multicol elements with column heights larger than the viewport may pose accessibility issues.
483+ Note: Multicol containers with column heights larger than the viewport may pose accessibility issues.
484484
485485
486486<h2 id="the-number-and-width-of-columns">
@@ -521,7 +521,7 @@ these two properties determine the outcome:-->
521521 Animatable : as <<length>>
522522 </pre>
523523
524- This property describes the width of columns in multicol elements .
524+ This property describes the width of columns in multicol containers .
525525
526526 <dl dfn-type=value dfn-for=column-width>
527527 <dt> <dfn>auto</dfn>
@@ -594,7 +594,7 @@ these two properties determine the outcome:-->
594594 Animatable : as <<integer>>
595595 </pre>
596596
597- This property describes the number of columns of a multicol element .
597+ This property describes the number of columns of a multicol container .
598598
599599 <dl dfn-type=value dfn-for=column-count>
600600 <dt> <dfn>auto</dfn>
@@ -657,7 +657,7 @@ Pseudo-algorithm</h3>
657657 in the pseudo-algorithm: U is the used width of the multi-column
658658 element.
659659
660- Note: The used width U of the multi-column element can depend on the element's contents,
660+ Note: The used width U of the multi-column container can depend on the element's contents,
661661 in which case it also depends on the computed values of the 'column-count' and 'column-width' properties.
662662 This specification does not define how U is calculated.
663663 Another module
@@ -677,7 +677,7 @@ Two assumptions are being made by the pseudo-algorithm:
677677
678678 <pre>
679679 (01) if ((column-width = auto) and (column-count = auto)) then
680- (02) exit; /* not a multicol element */
680+ (02) exit; /* not a multicol container */
681681 (03) if column-width = auto then
682682 (04) N := column-count
683683 (05) else if column-count = auto then
@@ -741,27 +741,27 @@ Two assumptions are being made by the pseudo-algorithm:
741741<h3 id="stacking-context">
742742Stacking context</h3>
743743
744- All column boxes in a multi-column element are in the same stacking
744+ All column boxes in a multi-column container are in the same stacking
745745 context and the drawing order of their contents is as specified in
746746 CSS 2.1. Column boxes do not establish new stacking contexts.
747747
748748<h2 id="column-gaps-and-rules">
749749Column gaps and rules</h2>
750750
751751 Column gaps and rules are placed between columns in the same
752- multicol element . The length of the column gaps and column rules
752+ multicol container . The length of the column gaps and column rules
753753 is equal to the column height. Column gaps take up space. That
754754 is, column gaps will push apart content in adjacent columns (within
755- the same multicol element ).
755+ the same multicol container ).
756756
757757 A column rule is drawn in the middle of the column gap with the
758- endpoints at opposing content edges of the multicol element . Column
758+ endpoints at opposing content edges of the multicol container . Column
759759 rules do not take up space. That is, the presence or thickness of a
760760 column rule will not alter the placement of anything else. If a column
761761 rule is wider than its gap, the adjacent column boxes will overlap the
762762 rule, and the rule may possibly extend outside the box of the multicol
763- element . Column rules are painted in the inline content layer, but
764- below all inline content inside the multicol element . Column rules are
763+ container . Column rules are painted in the inline content layer, but
764+ below all inline content inside the multicol container . Column rules are
765765 only drawn between two columns that both have content.
766766
767767<h3 id='column-gap'>
@@ -771,9 +771,9 @@ Column gaps and rules</h2>
771771 Name : column-gap
772772 Value : <<length-percentage>> | normal
773773 Initial : normal
774- Applies to : <a>multicol elements </a>
774+ Applies to : <a>multicol containers </a>
775775 Inherited : no
776- Percentages : refer to the content width of the multi-column element
776+ Percentages : refer to the content width of the multi-column container
777777 Media : visual
778778 Computed value : as specified, with <<length>>s made absolute
779779 Animation type : length, percentage, or calc
@@ -806,7 +806,7 @@ Column gaps and rules</h2>
806806 Name : column-rule-color
807807 Value : <<color>>
808808 Initial : currentcolor
809- Applies to : multicol elements
809+ Applies to : multicol containers
810810 Inherited : no
811811 Percentages : N/A
812812 Media : visual
@@ -828,7 +828,7 @@ Column gaps and rules</h2>
828828 Name : column-rule-style
829829 Value : <<'border-style'>>
830830 Initial : none
831- Applies to : multicol elements
831+ Applies to : multicol containers
832832 Inherited : no
833833 Percentages : N/A
834834 Media : visual
@@ -849,7 +849,7 @@ Column gaps and rules</h2>
849849 Name : column-rule-width
850850 Value : <<'border-width'>>
851851 Initial : medium
852- Applies to : multicol elements
852+ Applies to : multicol containers
853853 Inherited : no
854854 Percentages : N/A
855855 Media : visual
@@ -1024,7 +1024,7 @@ Spanning columns</h2>
10241024 <div class="example">
10251025 In this example, the
10261026 H2 element appears later in the content, and the height of the
1027- multicol element is constrained. Therefore, the H2 element appears in
1027+ multicol container is constrained. Therefore, the H2 element appears in
10281028 the overflow and there is not room to make the element spanning.
10291029 As a result, the element appears as if 'column-span: none' was
10301030 specified.
@@ -1253,7 +1253,7 @@ Filling columns</h2>
12531253 Name : column-fill
12541254 Value : auto | balance | balance-all
12551255 Initial : balance
1256- Applies to : multicol elements
1256+ Applies to : multicol containers
12571257 Inherited : no
12581258 Percentages : N/A
12591259 Media : see below
@@ -1289,7 +1289,7 @@ Filling columns</h2>
12891289
12901290 <!--
12911291 In paged media, this property will only have
1292- effect on the last page the multicol element appears on.
1292+ effect on the last page the multicol container appears on.
12931293 -->
12941294
12951295 <div class=example>
@@ -1449,7 +1449,7 @@ Filling columns</h2>
14491449Overflow</h2>
14501450
14511451<h3 id="overflow-inside-multicol-elements">
1452- Overflow inside multicol elements </h3>
1452+ Overflow inside multicol containers </h3>
14531453
14541454
14551455 Except for cases where this would cause a column break,
@@ -1459,7 +1459,7 @@ Overflow inside multicol elements</h3>
14591459 Note: See
14601460 [[#column-breaks]] for column breaks
14611461 and
1462- [[#pagination-and-overflow-outside-multicol]] for whether it is clipped to the multi-column element ’s content box.
1462+ [[#pagination-and-overflow-outside-multicol]] for whether it is clipped to the multi-column container ’s content box.
14631463
14641464 <div class=example>
14651465 In this example, the image is wider than the column:
@@ -1493,13 +1493,13 @@ Overflow inside multicol elements</h3>
14931493
14941494
14951495<h3 id="pagination-and-overflow-outside-multicol">
1496- Pagination and overflow outside multicol elements </h3>
1496+ Pagination and overflow outside multicol containers </h3>
14971497
14981498 Content and column rules that extend outside column boxes at
1499- the edges of the multi-column element are clipped according to the
1499+ the edges of the multi-column container are clipped according to the
15001500 'overflow' property.
15011501
1502- A multicol element can have more columns than it has room for due to:
1502+ A multicol container can have more columns than it has room for due to:
15031503
15041504 <ul>
15051505 <li>
@@ -1518,11 +1518,11 @@ Pagination and overflow outside multicol elements</h3>
15181518 media.
15191519 </ul>
15201520
1521- Columns that appear outside the multicol element in continuous media
1521+ Columns that appear outside the multicol container in continuous media
15221522 are called <dfn>overflow columns</dfn> .
15231523
15241524 <div class="example">
1525- In this example, the height of the multi-column element has been
1525+ In this example, the height of the multi-column container has been
15261526 constrained to a maximum height. Also, the style sheet specifies that
15271527 overflowing content should be visible:
15281528
@@ -1729,14 +1729,15 @@ This appendix is <em>informative</em>.
17291729
17301730<h3 id="changes-from-20171005">Changes from the <a href="https://www.w3.org/TR/2017/WD-css-multicol-1-20171005/">Working Draft (WD) of 5 October 2017</a></h3>
17311731<ul>
1732+ <li> Changed how we reference the element we have applied multicol to from multi-column or multicol <em> element</em> to multi-column or multicol <em> container</em> . <a href="https://github.com/w3c/csswg-drafts/issues/1965">Resolved: 22 November 2017</a> </li>
17321733 <li> Removed the example which stated "If a tall image is moved to a column on the next page to find room for it, its natural column may be left empty. If so, the column is still considered to have content for the purpose of deciding if the column rule should be drawn." <a href="https://github.com/w3c/csswg-drafts/issues/1740">Resolved: 7 September 2017</a> </li>
17331734</ul>
17341735
17351736<h3 id="changes-from-20110412">Changes from the
17361737<a href="https://www.w3.org/TR/2011/CR-css3-multicol-20110412/">Candidate Recommendation (CR) of 12 April 2011</a>.</h3>
17371738
17381739<ul>
1739- <li> Added July 1016 resolution to change the the track size floor to a required UA-specified value, consistent with the CSS Grid spec.
1740+ <li> Added July 2016 resolution to change the the track size floor to a required UA-specified value, consistent with the CSS Grid spec.
17401741 <li> Remove the restriction about overflow columns only being in continuous media in the statement that 'column-fill' has no effect on overflow columns. <a href="https://lists.w3.org/Archives/Public/www-style/2013Sep/0471.html">Resolved: September 2013</a> .
17411742 <li> Added keyword balance-all and examples to demonstrate how this should work. <a href="https://lists.w3.org/Archives/Public/www-style/2013Sep/0471.html">Resolved: September 2013</a> .
17421743 <li> The pseudo-algorithm has been revised on a number of occasions. <a href="https://lists.w3.org/Archives/Public/www-style/2013Feb/0471.html">Latest change Feb 2013</a> .
0 commit comments