[css-align] 1/3-baked baseline section revision

Author: tabatkins

css-align/Overview.bs

@@ -13,7 +13,7 @@ Previous Version: http://www.w3.org/TR/2013/WD-css3-align-20130514/
 Previous Version: http://www.w3.org/TR/2012/WD-css3-align-20120612/
 Abstract: This module contains the features of <a href="http://www.w3.org/TR/CSS/">CSS</a> relating to the alignment of boxes within their containers in the various CSS box layout models: block layout, table layout, flex layout, and grid layout. (The alignment of text and inline-level content is defined in [[CSS3TEXT]] and [[CSS3LINE]].)
 !Issue Tracking: <a href="http://www.w3.org/Style/CSS/Tracker/products/39">http://www.w3.org/Style/CSS/Tracker/products/39</a>
-Link Defaults: selectors-3 (dfn) first formatted line/first formatted lines, css-flexbox-1 (dfn) flex line/flex lines, css-multicol-1 (dfn) multi-column element
+Link Defaults: selectors-3 (dfn) first formatted line/first formatted lines, css-flexbox-1 (dfn) flex line/flex lines, css-multicol-1 (dfn) multi-column element, css-fonts-3 (dfn) first available font
 Ignored Terms: orthogonal, block container, table cell
 At Risk: ''last-baseline''
 </pre>
@@ -896,14 +896,21 @@ Block/Cross-Axis Alignment: the 'align-items' property</h3>
 Determining the Baseline of a Box</h2>
 
 	The <dfn>first baseline</dfn> (and <dfn>last baseline</dfn>) of a box
-	are determined differently based on the layout model, as follows:
+	for a given axis
+	is a set of baselines (alphabetic, central, etc.) belonging to a line box within the box.
+	The <a>alignment baseline</a> is one of these,
+	usually the dominant baseline of the <a>alignment container</a>.
+	(Note, however, that boxes might not have a baseline in a particular axis.)
+
+	The first and last baselines of a box are determined differently based on the layout model, as follows:
 
 	<dl>
 		<dt>''block''
 		<dt>''list-item''
 		<dd>
-			The inline-axis baseline of a block is the baseline of the first (last) in-flow line box in the block,
-			or the first (last) in-flow block-level child in the block that has a baseline,
+			The first (last) inline-axis baseline of a block
+			is generated from the dominant baseline of the first (last) in-flow line box in the block,
+			or is taken from the first (last) in-flow block-level child in the block that has a baseline,
 			whichever comes first (last).
 			If there is no such line box or child,
 			then the block has no baseline.
@@ -915,23 +922,23 @@ Determining the Baseline of a Box</h2>
 
 		<dt>''table''
 		<dd>
-			The inline-axis baseline of a table box is the baseline of its first (last) row.
-			However, when calculating the baseline of an inline-block,
+			The first (last) inline-axis baseline of a table box is the baseline of its first (last) row.
+			However, when finding the baseline of an inline-block,
 			table boxes must be skipped.
 
-			The block-axis baseline of a table is undefined.
+			The block-axis baseline of a table box is the baseline of its first (last) column.
 
 			<p class='issue'>
-				Or does it have no baseline?
-				Or is it based on its first column?
+				Or should it have no baseline?
 
 		<dt>''table-row''
 		<dd>
-			If any cells in the row participate in ''baseline'' (''last-baselin'') alignment,
-			the inline-axis first (last) baseline of the row is their baseline,
+			If any cells in the row participate in ''baseline'' (''last-baseline'') alignment,
+			the first (last) inline-axis baseline of the row is
+			generated from their shared <a>alignment baseline</a> and the row's <a>first available font</a>,
 			after alignment has been performed.
-			Otherwise, the inline-axis first (last) baseline of the row
-			is the bottom content edge of the lowest cell in the row.
+			Otherwise, the first (last) inline-axis baseline of the row
+			is synthesized from the lowest and highest content edges of the cells in the row.
 			[[!CSS21]]
 
 			A table row has no block-axis baseline.
@@ -953,10 +960,25 @@ Determining the Baseline of a Box</h2>
 			See <a href="http://www.w3.org/TR/css3-grid-layout/#grid-baselines">Grid Baselines</a> in [[!CSS3-GRID-LAYOUT]].
 	</dl>
 
+	To <dfn>generate baselines</dfn> for a box from a single baseline,
+	use the baseline table from the font settings and <a>first available font</a> of that box.
+
+	To <dfn>synthesize baselines</dfn> from a rectangle (or two parallel lines),
+	synthesize the alphabetic baseline from the lower line
+	and the central baseline by averaging the positions of the upper and lower lines.
+
+	Note: The forthcoming Inline Layout Module will define synthesis rules for baselines other than alphabetic and central.
+
 	<p class='issue'>
 		Maybe these things are wrong?
 		CSS 2.1 is really weird about baseline alignment.
-		This whole section needs to be better defined and reviewed.
+
+	<div class="issue">
+		We're still working on handling multiple baseline types (alphabetc, central, etc.)
+		and rows with multiple baseline-sharing groups (e.g. contains both first and last-aligned cells, or contains opposing writing modes).
+		Consider this section to be Under Construction.
+		<img src="http://dev.w3.org/csswg/construction.gif" style="display: block; margin: 1em auto;">
+	</div>
 
 
 <h2 id="changes">

css-align/Overview.html

@@ -963,14 +963,21 @@ <h2 class="heading settled heading" data-level=7 id=baseline-rules><span class=s
 Determining the Baseline of a Box</span><a class=self-link href=#baseline-rules></a></h2>
 
 <p>	The <dfn data-dfn-type=dfn data-noexport="" id=first-baseline>first baseline<a class=self-link href=#first-baseline></a></dfn> (and <dfn data-dfn-type=dfn data-noexport="" id=last-baseline>last baseline<a class=self-link href=#last-baseline></a></dfn>) of a box
-	are determined differently based on the layout model, as follows:
+	for a given axis
+	is a set of baselines (alphabetic, central, etc.) belonging to a line box within the box.
+	The <a data-link-type=dfn href=#alignment-baseline title="alignment baseline">alignment baseline</a> is one of these,
+	usually the dominant baseline of the <a data-link-type=dfn href=#alignment-container title="alignment container">alignment container</a>.
+	(Note, however, that boxes might not have a baseline in a particular axis.)
+
+<p>	The first and last baselines of a box are determined differently based on the layout model, as follows:
 
 	<dl>
 		<dt><span class=css data-link-type=maybe title=block>block</span>
 		<dt><span class=css data-link-type=maybe title=list-item>list-item</span>
 		<dd>
-			The inline-axis baseline of a block is the baseline of the first (last) in-flow line box in the block,
-			or the first (last) in-flow block-level child in the block that has a baseline,
+			The first (last) inline-axis baseline of a block
+			is generated from the dominant baseline of the first (last) in-flow line box in the block,
+			or is taken from the first (last) in-flow block-level child in the block that has a baseline,
 			whichever comes first (last).
 			If there is no such line box or child,
 			then the block has no baseline.
@@ -982,23 +989,23 @@ <h2 class="heading settled heading" data-level=7 id=baseline-rules><span class=s
 
 		<dt><span class=css data-link-type=maybe title=table>table</span>
 		<dd>
-			The inline-axis baseline of a table box is the baseline of its first (last) row.
-			However, when calculating the baseline of an inline-block,
+			The first (last) inline-axis baseline of a table box is the baseline of its first (last) row.
+			However, when finding the baseline of an inline-block,
 			table boxes must be skipped.
 
-<p>			The block-axis baseline of a table is undefined.
+<p>			The block-axis baseline of a table box is the baseline of its first (last) column.
 
-			<p class=issue id=issue-f2630124><a class=self-link href=#issue-f2630124></a>
-				Or does it have no baseline?
-				Or is it based on its first column?
+			<p class=issue id=issue-757da0f8><a class=self-link href=#issue-757da0f8></a>
+				Or should it have no baseline?
 
 		<dt><span class=css data-link-type=maybe title=table-row>table-row</span>
 		<dd>
-			If any cells in the row participate in <a class=css data-link-type=maybe href=#valuedef-baseline title=baseline>baseline</a> (<span class=css data-link-type=maybe title=last-baselin>last-baselin</span>) alignment,
-			the inline-axis first (last) baseline of the row is their baseline,
+			If any cells in the row participate in <a class=css data-link-type=maybe href=#valuedef-baseline title=baseline>baseline</a> (<a class=css data-link-type=maybe href=#valuedef-last-baseline title=last-baseline>last-baseline</a>) alignment,
+			the first (last) inline-axis baseline of the row is
+			generated from their shared <a data-link-type=dfn href=#alignment-baseline title="alignment baseline">alignment baseline</a> and the row’s <a data-link-type=dfn href=http://dev.w3.org/csswg/css-fonts-3/#first-available-font title="first available font">first available font</a>,
 			after alignment has been performed.
-			Otherwise, the inline-axis first (last) baseline of the row
-			is the bottom content edge of the lowest cell in the row.
+			Otherwise, the first (last) inline-axis baseline of the row
+			is synthesized from the lowest and highest content edges of the cells in the row.
 			<a data-biblio-type=normative data-link-type=biblio href=#css21 title=css21>[CSS21]</a>
 
 <p>			A table row has no block-axis baseline.
@@ -1020,10 +1027,25 @@ <h2 class="heading settled heading" data-level=7 id=baseline-rules><span class=s
 			See <a href=http://www.w3.org/TR/css3-grid-layout/#grid-baselines>Grid Baselines</a> in <a data-biblio-type=normative data-link-type=biblio href=#css3-grid-layout title=css3-grid-layout>[CSS3-GRID-LAYOUT]</a>.
 	</dl>
 
-	<p class=issue id=issue-c300815d><a class=self-link href=#issue-c300815d></a>
+<p>	To <dfn data-dfn-type=dfn data-noexport="" id=generate-baselines>generate baselines<a class=self-link href=#generate-baselines></a></dfn> for a box from a single baseline,
+	use the baseline table from the font settings and <a data-link-type=dfn href=http://dev.w3.org/csswg/css-fonts-3/#first-available-font title="first available font">first available font</a> of that box.
+
+<p>	To <dfn data-dfn-type=dfn data-noexport="" id=synthesize-baselines>synthesize baselines<a class=self-link href=#synthesize-baselines></a></dfn> from a rectangle (or two parallel lines),
+	synthesize the alphabetic baseline from the lower line
+	and the central baseline by averaging the positions of the upper and lower lines.
+
+<p class=note>	Note: The forthcoming Inline Layout Module will define synthesis rules for baselines other than alphabetic and central.
+
+	<p class=issue id=issue-cfbec8b9><a class=self-link href=#issue-cfbec8b9></a>
 		Maybe these things are wrong?
 		CSS 2.1 is really weird about baseline alignment.
-		This whole section needs to be better defined and reviewed.
+
+	<div class=issue id=issue-4ad4e48a><a class=self-link href=#issue-4ad4e48a></a>
+		We’re still working on handling multiple baseline types (alphabetc, central, etc.)
+		and rows with multiple baseline-sharing groups (e.g. contains both first and last-aligned cells, or contains opposing writing modes).
+		Consider this section to be Under Construction.
+		<img src=http://dev.w3.org/csswg/construction.gif style="display: block; margin: 1em auto;">
+	</div>
 
 
 <h2 class="heading settled heading" data-level=8 id=changes><span class=secno>8 </span><span class=content>
@@ -1207,6 +1229,7 @@ <h2 class="no-num no-ref heading settled heading" id=index><span class=content>
 <li>first-baseline self-alignment, <a href=#baseline-self-alignment title="section 5.3">5.3</a>
 <li>flex-end, <a href=#valuedef-flex-end title="section 3.1">3.1</a>
 <li>flex-start, <a href=#valuedef-flex-start title="section 3.1">3.1</a>
+<li>generate baselines, <a href=#generate-baselines title="section 7">7</a>
 <li>&lt;item-position&gt;, <a href=#typedef-item-position title="section 3.1">3.1</a>
 <li>justify-content, <a href=#propdef-justify-content title="section 4">4</a>
 <li>justify-items, <a href=#propdef-justify-items title="section 6.1">6.1</a>
@@ -1230,6 +1253,7 @@ <h2 class="no-num no-ref heading settled heading" id=index><span class=content>
 <li>space-evenly, <a href=#valuedef-space-evenly title="section 3.3">3.3</a>
 <li>start, <a href=#valuedef-start title="section 3.1">3.1</a>
 <li>stretch, <a href=#valuedef-stretch title="section 3.3">3.3</a>
+<li>synthesize baselines, <a href=#synthesize-baselines title="section 7">7</a>
 <li>true, <a href=#valuedef-true title="section 3.4">3.4</a>
 </ul></div>
 
@@ -1270,13 +1294,18 @@ <h2 class="no-num heading settled" id=issues-index><span class=content>Issues In
 		which has the current behavior of stretching non-replaced boxes and start-aligning replaced ones.
 
 	<a href=#issue-225803b9> ↵ </a></div><div class=issue>
-				Or does it have no baseline?
-				Or is it based on its first column?
+				Or should it have no baseline?
 
-		<a href=#issue-f2630124> ↵ </a></div><div class=issue>
+		<a href=#issue-757da0f8> ↵ </a></div><div class=issue>
 		Maybe these things are wrong?
 		CSS 2.1 is really weird about baseline alignment.
-		This whole section needs to be better defined and reviewed.
+
+	<a href=#issue-cfbec8b9> ↵ </a></div><div class=issue>
+		We’re still working on handling multiple baseline types (alphabetc, central, etc.)
+		and rows with multiple baseline-sharing groups (e.g. contains both first and last-aligned cells, or contains opposing writing modes).
+		Consider this section to be Under Construction.
+		<img src=http://dev.w3.org/csswg/construction.gif style="display: block; margin: 1em auto;">
+	<a href=#issue-4ad4e48a> ↵ </a></div>
 
 
-<a href=#issue-c300815d> ↵ </a></div></div>
+</div>