[css-tables] clarify diagram; fix #1689

Author: FremyCompany

css-tables-3/Overview.bs

@@ -605,6 +605,35 @@ spec:css22; type:property; text:display
 					to make it easier to understand.
 			</p>
 			<img src="images/CSS-Tables-Layout-Merged.svg" style="width: 100%" />
+			<details style="border: 3px solid silver">
+				<summary style="background:silver">Legend</summary>
+				<div>
+
+					<b>Sizing algorithms: </b>
+					Each drawing of the table represents a way of sizing the columns.
+					The four cases in the left are the sizing-guesses described above in the spec: 
+						<a href="#min-content-guess">min-content</a>, 
+						<a href="#min-content-percentage-guess">min-content-percentage</a>, 
+						<a href="#min-content-specified-guess">min-content-specified</a>, and 
+						<a href="#max-content-guess">max-content</a>.
+					The cases on the right are interpolations required for sizes that do not match exactly one of the four sizing-guesses.
+
+					<b>Choice of sizing method: </b>
+					The sizing method selection always starts by the min-content sizing-guess (top let), 
+						and then proceeds by comparing the available space and the space consumed by the method currently in use.
+					Green arrows is the direction you should follow 
+						if you have extra space to distribute after applying the current method.
+					Red arrows is the direction you should follow 
+						if you have distributed too much space by applying the current method and need to backtrack.
+
+					<b>Columns types: </b>
+					Each type of column (auto, px, %) has its own color (yellow, blue, orange).
+					In an interpolation: 
+						columns that get shrinked down from their size in previous sizing-guess are repainted red, and 
+						columns that get expanded from their size in previous sizing-guess are repainted green.
+
+				</div>
+			</details>
 			<figcaption>Overview of the table layout algorithm. Not normative.</figcaption>
 		</figure>
 
@@ -1645,13 +1674,13 @@ spec:css22; type:property; text:display
 				- <dfn>auto-column</dfn>:<br>
 					any other column
 
-			Then, valid sizing methods are to be assigned to the columns by sizing type, yielding the following guesses:
+			Then, valid sizing methods are to be assigned to the columns by sizing type, yielding the following sizing-guesses:
 
 			<ol>
-				<li>The <dfn>min-content guess</dfn> is the set of column width assignments where
+				<li>The <dfn>min-content sizing-guess</dfn> is the set of column width assignments where
 					each column is assigned its min-content width.
 
-				<li>The <dfn>min-content-percentage guess</dfn> is the set of column width assignments where:
+				<li>The <dfn>min-content-percentage sizing-guess</dfn> is the set of column width assignments where:
 					<ul>
 						<li>each <a>percent-column</a>
 							is assigned the larger of:
@@ -1663,7 +1692,7 @@ spec:css22; type:property; text:display
 						<li>all other columns are assigned their min-content width.
 					</ul>
 
-				<li>The <dfn>min-content-specified guess</dfn> is the set of column width assignments where:
+				<li>The <dfn>min-content-specified sizing-guess</dfn> is the set of column width assignments where:
 					<ul>
 						<li>each <a>percent-column</a>
 							is assigned the larger of:
@@ -1678,7 +1707,7 @@ spec:css22; type:property; text:display
 						<li>all other columns are assigned their min-content width.
 					</ul>
 
-				<li>The <dfn>max-content guess</dfn> is the set of column width assignments where:
+				<li>The <dfn>max-content sizing-guess</dfn> is the set of column width assignments where:
 					<ul>
 						<li>each <a>percent-column</a>
 							is assigned the larger of:
@@ -1695,18 +1724,18 @@ spec:css22; type:property; text:display
 				Note that:
 
 				- The <a>assignable table width</a> is always greater than or equal
-					to the table width resulting from the min-content guess.
-				- The widths for each column in the four guesses
-					(min-content guess, min-content-percentage guess, min-content-specified guess, and max-content guess)
+					to the table width resulting from the min-content sizing-guess.
+				- The widths for each column in the four sizing-guesses
+					(min-content, min-content-percentage, min-content-specified, and max-content)
 					are in nondecreasing order.
 
 			</div>
 
-			If the <a>assignable table width</a> is less than or equal to the <a>max-content guess</a>,
+			If the <a>assignable table width</a> is less than or equal to the <a>max-content sizing-guess</a>,
 				the used widths of the columns must be the linear combination (with weights adding to 1)
-				of the two consecutive guesses whose width sums bound the available width.
+				of the two consecutive sizing-guesses whose width sums bound the available width.
 
-			Otherwise, the used widths of the columns are the result of starting from the <a>max-content guess</a>
+			Otherwise, the used widths of the columns are the result of starting from the <a>max-content sizing-guess</a>
 				and distributing the excess width to the columns of the table
 				according to the rules for <a>distributing excess width to columns</a> (for used width).