[css-align] Fix definition of when flex-start/end behave as start/end. Fixes w3c#1401.

Author: tabatkins

css-align/Overview.bs

@@ -281,15 +281,23 @@ Positional Alignment: the ''center'', ''start'', ''end'', ''self-start'', ''self
 		<dd><strong>Only used in flex layout.</strong> [[!CSS-FLEXBOX-1]]
 			Aligns the <a>alignment subject</a> to be flush with the edge of the <a>alignment container</a>
 			corresponding to the <a>flex container</a>’s main-start or cross-start side, as appropriate.
-			When used on boxes that are not children of a <a>flex container</a>,
-			this value behaves as ''start''.
+
+			When used outside of a <a>flex formatting context</a>, this value behaves as ''start''.
+			That is, on boxes that are not children of a <a>flex container</a>,
+			this value behaves as ''start'' when used in the <a>self-alignment properties</a>,
+			and on boxes that are not flex containers,
+			this value behaves as ''start'' when used in the <a>content-distribution properties</a>.
 
 		<dt><dfn for="<self-position>, <content-position>">flex-end</dfn> <small>([[#self-alignment|self]], [[#content-distribution|content]])</small>
 		<dd><strong>Only used in flex layout.</strong>
 			Aligns the <a>alignment subject</a> to be flush with the edge of the <a>alignment container</a>
 			corresponding to the <a>flex container</a>’s main-end or cross-end side, as appropriate.
-			When used on boxes that are not children of a <a>flex container</a>,
-			this value behaves as ''end''.
+
+			When used outside of a <a>flex formatting context</a>, this value behaves as ''end''.
+			That is, on boxes that are not children of a <a>flex container</a>,
+			this value behaves as ''end'' when used in the <a>self-alignment properties</a>,
+			and on boxes that are not flex containers,
+			this value behaves as ''end'' when used in the <a>content-distribution properties</a>.
 
 		<dt><dfn for="<self-position>, <content-position>">left</dfn> <small>([[#self-alignment|self]], [[#content-distribution|content]])</small>
 		<dd>Aligns the <a>alignment subject</a> to be flush with the <a>alignment container</a>’s <a href="https://www.w3.org/TR/css3-writing-modes/#line-left">line-left</a> edge.
@@ -620,7 +628,7 @@ Content Distribution: aligning a box's contents within itself</h2>
 <h3 id='align-justify-content'>
 The 'justify-content' And 'align-content' Properties</h3>
 
-	The <dfn export>content distribution properties</dfn> 'align-content' and 'justify-content'
+	The <dfn export>content-distribution properties</dfn> 'align-content' and 'justify-content'
 	(and their 'place-content' shorthand)
 	control alignment of the box's content within its content box.
 
@@ -797,7 +805,7 @@ The 'justify-content' And 'align-content' Properties</h3>
 	See [[!CSS-GRID-1]] for details.
 
 <h3 id='place-content'>
-Content Distribution Shorthand: the 'place-content' property</h3>
+Content-Distribution Shorthand: the 'place-content' property</h3>
 
 	<pre class="propdef">
 	Name: place-content
@@ -821,11 +829,11 @@ Content Distribution Shorthand: the 'place-content' property</h3>
 <h3 id="overflow-scroll-position">
 Overflow and Scroll Positions</h3>
 
-	The <a>content distribution properties</a> also affect the initial scroll position,
+	The <a>content-distribution properties</a> also affect the initial scroll position,
 	setting it to display the appropriate portion of the scrollable area.
 	In other words,
 	the <a>scrollable overflow region</a> is aligned relative to the viewport
-	as specified by the <a>content distribution properties</a>.
+	as specified by the <a>content-distribution properties</a>.
 	Additionally, so that the content remains in the <a>scrollable overflow region</a> in order to be scrollable,
 	the ''overflow/scroll'' and ''overflow/auto'' values of 'overflow'
 	trigger ''safe'' content alignment always.
@@ -905,7 +913,7 @@ Baseline Content-Alignment</h3>
 <h2 id='self-alignment'>
 Self-Alignment: Aligning the Box within its Parent</h2>
 
-	The 'align-self' and 'justify-self' properties
+	The <dfn export>self-alignment properties</dfn> 'align-self' and 'justify-self'
 	(and their 'place-self' shorthand)
 	control alignment of the box within its containing block.