[css-values] Correct regressions from https://hg.csswg.org/drafts/rev/7bb70a0516c3 , clean up prose, and remove incorrect example.

Author: fantasai

css-values/Overview.bs

@@ -661,16 +661,18 @@ Percentages: the <<percentage>> type</h3>
 	It corresponds to the <<percentage-token>> production
 	in the <a href="https://www.w3.org/TR/css-syntax/">CSS Syntax Module</a> [[!CSS3SYN]].
 
-	Percentage values are often relative to another value,
+	Percentage values are always relative to another measurement,
 	for example a length.
-	Each property that allows percentages also defines the value to which the percentage refers.
-	The value may be that of another property for the same element,
-	a property for an ancestor element,
-	or a value of the formatting context
+	Each property that allows percentages also defines the measurement to which the percentage refers.
+	This measurement can be a value of another property for the same element,
+	that of a property for an ancestor element,
+	or a measurement of the formatting context
 	(e.g., the width of a <a>containing block</a>).
-	While such "relative" percentages are often indicated in prose,
-	they can also be indicated with an explicit grammar term,
-	one for each basic <a>dimension</a> type:
+
+	In cases where a <<percentage>> can represent the same quantity
+	as a <a>dimension</a> or <a>number</a> in the same <a>component value</a> position,
+	and can therefore be combined with them in a ''calc()'' expression,
+	the following convenience notations may be used in the property grammar:
 
 	: <dfn>&lt;length-percentage></dfn>
 	:: Equivalent to <code class=prod>[ <<length>> | <<percentage>> ]</code>,
@@ -689,21 +691,19 @@ Percentages: the <<percentage>> type</h3>
 		where the <<percentage>> will resolve to a <<number>>.
 
 	<div class="example">
-		For example, in the 'width' property <<percentage>> values are relative to the width of the containing block.
-		If the containing block is ''1000px'' wide,
+		For example, in the 'width' property <<percentage>> values are relative to the width of the containing block,
+		and therefore represent a length,
+		just as <<length>> values do:
+		if the containing block is ''1000px'' wide,
 		then ''width: 500px;'' and ''width: 50%'' have the exact same behavior.
 		This means that ''width: calc(500px + 50%);'' is allowed--
-		it has the same behavior as ''width: calc(500px + 500px)'',
+		in this context it has the same behavior as ''width: calc(500px + 500px)'',
 		which is an easy length+length calculation.
 
 		On the other hand, the second and third arguments of the ''hsl()'' function are bare <<percentage>>s,
-		not relative to any other value.
+		not relative to any other numerical syntax.
 		They cannot be combined with anything in ''calc()''
 		(except themselves, in useless expressions like ''calc(10% + 20%)'').
-
-		An exceptional case is 'background-position'--
-		there, <<percentage>>s and <<length>>s actually cause different behavior/interpretations.
-		However, there is prose defining how to interpret a ''calc()'' mixing the two in that context.
 	</div>
 
 <h3 id='dimensions'>