@@ -20,6 +20,7 @@ At Risk: The ''digits'' value of 'text-combine-upright'.
2020At Risk : The look-ahead/look-behind sequencing rules for 'text-combine-upright'.
2121Ignored Terms : glyph orientation, *-left, *-right, *-top, *-bottom, block containers, text-combine-mode
2222Link Defaults : css21 (property) display/min-height/max-height/min-width/max-width/clip/left/right/bottom/top, css-text-3 (property) letter-spacing, css-text-decor-3 (property) text-decoration, svg2 (property) glyph-orientation-vertical/glyph-orientation-horizontal
23+ Use <i> Autolinks : yes
2324</pre>
2425
2526<style>
@@ -1873,16 +1874,17 @@ Dimensional Mapping</h3>
18731874 <p> For example, the calculation rules in
18741875 <a href="http://www.w3.org/TR/CSS21/visudet.html#Computing_widths_and_margins">CSS2.1 Section 10.3</a>
18751876 are used for the inline dimension measurements:
1876- they apply to the <i> inline- size</i> (which could be either the physical width or physical height)
1877+ they apply to the <i> inline size</i> (which could be either the physical width or physical height)
18771878 and to the <i> inline-start</i> and <i> inline-end</i> margins, padding, and border.
18781879 Likewise the calculation rules in
18791880 <a href="http://www.w3.org/TR/CSS21/visudet.html#Computing_heights_and_margins">CSS2.1 Section 10.6</a>
1880- are used in the block dimension: they apply to the <i> block-size</i> and to
1881- the <i> block-start</i> and <i> block-end</i> margins, padding, and border. [[!CSS21]]
1881+ are used in the block dimension:
1882+ they apply to the <i> block size</i>
1883+ and to the <i> block-start</i> and <i> block-end</i> margins, padding, and border. [[!CSS21]]
18821884
18831885 <p> As a corollary, percentages on the margin and padding properties,
18841886 which are always calculated with respect to the containing block
1885- width in CSS2.1, are calculated with respect to the <em><i> inline- size</i></em>
1887+ width in CSS2.1, are calculated with respect to the <em><i> inline size</i></em>
18861888 of the containing block in CSS3.
18871889
18881890<h3 id="orthogonal-flows">
@@ -1917,13 +1919,13 @@ Orthogonal Flows</h3>
19171919 <li>
19181920 In the sizing phase—calculating the width and height of the
19191921 box—the dimensions of the box and the containing block
1920- are mapped to the <i> inline- size</i> and <i> block- size</i> and calculations are performed
1922+ are mapped to the <i> inline size</i> and <i> block size</i> and calculations are performed
19211923 accordingly using the writing mode of
19221924 the box establishing the <i> orthogonal flow</i> .
19231925 <li>
19241926 In the positioning phase—calculating the positioning offsets,
19251927 margins, borders, and padding—the dimensions of the box and
1926- its containing block are mapped to the <i> inline- size</i> and <i> block- size</i>
1928+ its containing block are mapped to the <i> inline size</i> and <i> block size</i>
19271929 and calculations are performed according to the writing mode of the
19281930 <em> containing block</em> of the box establishing the <i> orthogonal flow</i> .
19291931 </ul>
@@ -1942,12 +1944,12 @@ Orthogonal Flows</h3>
19421944 </div>
19431945
19441946 <p>
1945- For example, if a vertical block is placed inside a horizontal
1946- block, then when calculating the physical height (which is the
1947- <i> inline-size </i> ) of the child block the physical height of the parent
1948- block is used as the child's containing block <i> inline- size</i> , even
1949- though the physical height is the <i> block- size</i> , not the <i> inline- size</i> , of
1950- the parent block.
1947+ For example, if a vertical block is placed inside a horizontal block,
1948+ then when calculating the physical height (which is the <i> inline size </i> )
1949+ of the child block the physical height of the parent block is used
1950+ as the child's containing block <i> inline size</i> ,
1951+ even though the physical height is the <i> block size</i> , not the <i> inline size</i> ,
1952+ of the parent block.
19511953
19521954 <p>
19531955 On the other hand,
@@ -1961,25 +1963,27 @@ Orthogonal Flows</h3>
19611963<h4 id="orthogonal-auto">
19621964Auto-sizing in Orthogonal Flows</h4>
19631965
1964- <p> It is common in CSS for a containing block to have a definite
1965- <i> inline-size</i> , but not a definite <i> block-size</i> . This typically happens in
1966- CSS2.1 when a containing block has an ''height/auto'' height, for
1967- example: its width is given by the calculations in
1966+ <p> It is common in CSS for a containing block to have a definite <i> inline size</i> ,
1967+ but not a definite <i> block size</i> .
1968+ This typically happens in CSS2.1
1969+ when a containing block has an ''height/auto'' height,
1970+ for example: its width is given by the calculations in
19681971 <a href="http://www.w3.org/TR/CSS21/visudet.html#blockwidth">10.3.3</a> ,
1969- but its <i> block-size</i> depends on its contents. In such cases the
1970- <i> available inline-size</i> is defined as the <i> inline-size</i> of the
1971- containing block; but the <i> available block-size</i> , which
1972- would otherwise be the <i> block-size</i> of the containing block, is
1973- infinite.
1972+ but its <i> block size</i> depends on its contents.
1973+ In such cases the <i> available inline size</i> is defined
1974+ as the <i> inline size</i> of the containing block;
1975+ but the <i> available block size</i> ,
1976+ which would otherwise be the <i> block size</i> of the containing block,
1977+ is infinite.
19741978
19751979 <p> Putting a box in an <i> orthogonal flow</i> allows the opposite to happen:
1976- for the <i> available blocksize </i> to be defined, but the <i> available
1977- inline size</i> to be indefinite. In such cases a percentage of the
1978- containing block’s <i> inline- size</i> cannot be defined, and <i> inline-axis </i>
1979- computations cannot be resolved. In these cases, the initial
1980- containing block's size is used as a <i> fallback </i> variable
1981- in place of the <i> available inline- size</i> for calculations that
1982- require a definite <i> available inline- size</i> .
1980+ for the <i> available block size </i> to be defined,
1981+ but the <i> available inline size</i> to be indefinite.
1982+ In such cases a percentage of the containing block’s <i> inline size</i> cannot be defined,
1983+ and <i> inline axis </i> computations cannot be resolved.
1984+ In these cases, the initial containing block's size is used
1985+ as a <i> fallback </i> variable in place of the <i> available inline size</i>
1986+ for calculations that require a definite <i> available inline size</i> .
19831987
19841988 <p> See [[!CSS3-SIZING]] for further details on CSS sizing terminology and concepts.
19851989
@@ -1988,7 +1992,7 @@ Auto-sizing Block Containers in Orthogonal Flows</h4>
19881992
19891993 <p>
19901994 If a box establishing an <i> orthogonal flow</i> is a block container or multi-column element,
1991- for the case where the box's <i> inline- size</i> is ''width/auto'' :
1995+ for the case where the box's <i> inline size</i> is ''width/auto'' :
19921996
19931997 <ol>
19941998 <li><strong> Calculate the used 'column-width' :</strong>
@@ -2008,8 +2012,8 @@ Auto-sizing Block Containers in Orthogonal Flows</h4>
20082012 <dd> the box’s <i> inline-axis</i> <a href="http://www.w3.org/TR/css3-sizing/#terms">fill-available fit</a>
20092013 into the smaller of
20102014 <ul>
2011- <li> the box’s <i> available inline- size</i>
2012- <li> the initial containing block’s <i> inline- size</i>
2015+ <li> the box’s <i> available inline size</i>
2016+ <li> the initial containing block’s <i> inline size</i>
20132017 </dl>
20142018
20152019 <div class="note">
@@ -2022,7 +2026,7 @@ Auto-sizing Block Containers in Orthogonal Flows</h4>
20222026 is wrapped into columns in the flow direction of the containing block,
20232027 thus avoiding T-shaped documents.
20242028 Authors can control the measure of these columns by setting 'column-width' ,
2025- or disable this behavior by setting the <i> inline- size</i> property
2029+ or disable this behavior by setting the <i> inline size</i> property
20262030 to a non-''width/auto'' value such as ''width/max-content'' .
20272031 <br style="clear:both;">
20282032 </div>
@@ -2039,14 +2043,14 @@ Auto-sizing Block Containers in Orthogonal Flows</h4>
20392043 </ul>
20402044
20412045 <li><strong> Calculate the used column length:</strong>
2042- If the computed <i> block- size</i> is ''height/auto''
2046+ If the computed <i> block size</i> is ''height/auto''
20432047 and the specified value of at least one of 'column-count' and 'column-width' was ''column-width/auto'' ,
2044- use the box’s <i> block- size</i> (if that is <i> definite</i> ),
2045- else the <i> fill-available block- size</i> of the box (if that is <i> definite</i> ),
2046- else the box’s <i> max-content block- size</i> .
2048+ use the box’s <i> block size</i> (if that is <i> definite</i> ),
2049+ else the <i> fill-available block size</i> of the box (if that is <i> definite</i> ),
2050+ else the box’s <i> max-content block size</i> .
20472051 Otherwise follow the normal rules for sizing a multi-column element.
20482052 <p class="issue">
2049- Should we factor in the box’s min-content block- size in this formula,
2053+ Should we factor in the box’s <i> min-content block size</i> in this formula,
20502054 so that e.g. a large image will not overflow the box,
20512055 but cause the box to overflow the containing block?
20522056
@@ -2057,19 +2061,19 @@ Auto-sizing Block Containers in Orthogonal Flows</h4>
20572061 </ol>
20582062
20592063 <p>
2060- The used <i> inline- size</i> of the resulting multi-column element is then calculated:
2064+ The used <i> inline size</i> of the resulting multi-column element is then calculated:
20612065 if the content neither line-wraps nor fragments within the multi-column element,
2062- then the used <i> inline- size</i> is the <i> max-content inline- size</i> of the box's contents;
2066+ then the used <i> inline size</i> is the <i> max-content inline size</i> of the box's contents;
20632067 else it is calculated from the used 'column-width' , 'column-count' , and 'column-gap' .
20642068
20652069 <p>
2066- The used <i> block- size</i> of the box is either the used column <i> block- size</i>
2070+ The used <i> block size</i> of the box is either the used column <i> block size</i>
20672071 (if multiple columns were used)
2068- or the <i> max-content block- size</i> of the content.
2072+ or the <i> max-content block size</i> of the content.
20692073
20702074 <p>
20712075 If the UA does not support CSS Multi-column Layout [[!CSS3COL]] ,
2072- the UA may instead calculate the box's <i> inline- size</i> assuming an infinite <i> block- size</i> ,
2076+ the UA may instead calculate the box's <i> inline size</i> assuming an infinite <i> block size</i> ,
20732077 thus laying out its contents into a single column.
20742078 Note that this can, however, result in content that is clipped
20752079 or otherwise inaccessible.
@@ -2079,12 +2083,12 @@ Auto-sizing Other Orthogonal Flow Roots</h4>
20792083
20802084 <p> In order to limit the length of lines,
20812085 block containers have special auto-sizing behavior (defined <a href="#auto-multicol">above</a> )
2082- when their <i> available inline- size</i> is infinite
2086+ when their <i> available inline size</i> is infinite
20832087 (which typically occurs when they establish an <i> orthogonal flow</i> ).
20842088
2085- <p> Other layout models simply lay out into the infinite <i> available inline- size</i>
2089+ <p> Other layout models simply lay out into the infinite <i> available inline size</i>
20862090 at their <i> max-content size</i> .
2087- However, they pass through the infinite <i> available inline- size</i>
2091+ However, they pass through the infinite <i> available inline size</i>
20882092 to block containers they contain,
20892093 possibly triggering that special auto-sizing behavior on those block containers
20902094 even though they do not themselves establish an <i> orthogonal flow</i> .
@@ -2093,10 +2097,10 @@ Auto-sizing Other Orthogonal Flow Roots</h4>
20932097 <p> For example,
20942098 a table or <i> flex container</i> establishing an <i> orthogonal flow</i>
20952099 is laid out into its given <i> available space</i> .
2096- If its <i> available inline- size</i> is infinite,
2100+ If its <i> available inline size</i> is infinite,
20972101 this effectively lays the box out at its <i> max-content size</i> .
20982102 However, any of its table cells or <i> flex items</i> that are <i> block containers</i>
2099- are laid out assuming infinite <i> available inline- size</i>
2103+ are laid out assuming infinite <i> available inline size</i>
21002104 and so behave accordingly.
21012105 </div>
21022106
0 commit comments