[css-backgrounds] Replaced <length> | <percentage> by <length-percentage> (#263)

Author: SebastianZ

css-backgrounds-4/Overview.bs

@@ -40,16 +40,16 @@ Background Positioning: the 'background-position' shorthand property</h3>
 
 	<p>Where
 	<pre class=prod><dfn>&lt;position&gt;</dfn> = [
-	  [ left | center | right | top | bottom | start | end | <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> ]
+	  [ left | center | right | top | bottom | start | end | <<length-percentage>> ]
 	|
-	  [ left | center | right | x-start | x-end | <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> ]
-	  [ top | center | bottom | y-start | y-end | <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> ]
+	  [ left | center | right | x-start | x-end | <<length-percentage>> ]
+	  [ top | center | bottom | y-start | y-end | <<length-percentage>> ]
 	|
-	  [ center | [ left | right | x-start | x-end ] [ <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> ]? ] &amp;&amp;
-	  [ center | [ top | bottom | y-start | y-end ] [ <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> ]? ]
+	  [ center | [ left | right | x-start | x-end ] <<length-percentage>>? ] &amp;&amp;
+	  [ center | [ top | bottom | y-start | y-end ] <<length-percentage>>? ]
 	|
-	  [ center | [ start | end ] [ <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> ]? ]
-	  [ center | [ start | end ] [ <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> ]? ]	]</pre>
+	  [ center | [ start | end ] <<length-percentage>>? ]
+	  [ center | [ start | end ] <<length-percentage>>? ]	]</pre>
 
 	Values have the following meanings:
 	<dl>

css-backgrounds/Overview.src.html

@@ -701,13 +701,13 @@ <h3 id="the-background-position">Positioning Images: the 'background-position' p
 
 <p>Where
 <pre class=prod><dfn><var>&lt;position&gt;</var></dfn> = [
-  [ left | center | right | top | bottom | <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> ]
+  [ left | center | right | top | bottom | <var>&lt;length-percentage&gt;</var> ]
 |
-  [ left | center | right | <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> ]
-  [ top | center | bottom | <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> ]
+  [ left | center | right | <var>&lt;length-percentage&gt;</var> ]
+  [ top | center | bottom | <var>&lt;length-percentage&gt;</var> ]
 |
-  [ center | [ left | right ] [ <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> ]? ] &amp;&amp;
-  [ center | [ top | bottom ] [ <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> ]? ]
+  [ center | [ left | right ] <var>&lt;length-percentage&gt;</var>? ] &amp;&amp;
+  [ center | [ top | bottom ] <var>&lt;length-percentage&gt;</var>? ]
 ]</pre>
 
 <p>If only one value is specified, the second value is assumed to be
@@ -1029,7 +1029,7 @@ <h3 id="the-background-size">Sizing Images: the 'background-size' property</h3>
 
 <p>Specifies the size of the background images. Where
 
-<pre class=prod><dfn><var>&lt;bg-size&gt;</var></dfn> = [ <var>&lt;length&gt;</var> | <var>&lt;percentage&gt;</var> | auto ]{1,2} | cover | contain</pre>
+<pre class=prod><dfn><var>&lt;bg-size&gt;</var></dfn> = [ <var>&lt;length-percentage&gt;</var> | auto ]{1,2} | cover | contain</pre>
 
 <p>Values have the following meanings:
 
@@ -1045,7 +1045,7 @@ <h3 id="the-background-size">Sizing Images: the 'background-size' property</h3>
     (if any), to the smallest size such that both its width and its
     height can completely cover the background positioning area.</dd>
 
-  <dt>[ <var>&lt;length&gt;</var> | <var>&lt;percentage&gt;</var>
+  <dt>[ <var>&lt;length-percentage&gt;</var>
   | <dfn title="''auto''!!'background-size' value">auto</dfn> ]{1,2}</dt>
   <dd>
     <p>The first value gives the width of the corresponding image,
@@ -1923,7 +1923,7 @@ <h3 id="the-border-radius">Curve Radii: the 'border-radius' properties</h3>
         <dfn>border-bottom-left-radius</dfn>
     <tr>
     <th><a href="#values">Value</a>:
-    <td>[ <var>&lt;length&gt;</var> | <var>&lt;percentage&gt;</var> ]{1,2}
+    <td><var>&lt;length-percentage&gt;</var>{1,2}
   <tr>
     <th>Initial:
     <td>0
@@ -1954,8 +1954,7 @@ <h3 id="the-border-radius">Curve Radii: the 'border-radius' properties</h3>
     <td><dfn>border-radius</dfn>
   <tr>
     <th><a href="#values">Value</a>:
-    <td>[ <var>&lt;length&gt;</var> | <var>&lt;percentage&gt;</var> ]{1,4}
-        [ / [ <var>&lt;length&gt;</var> | <var>&lt;percentage&gt;</var> ]{1,4} ]?
+    <td><var>&lt;length-percentage&gt;</var>{1,4} [ / <var>&lt;length-percentage&gt;</var>{1,4} ]?
   <tr>
     <th>Initial:
     <td>see individual properties
@@ -2469,7 +2468,7 @@ <h3 id="the-border-image-width">Drawing Areas: the 'border-image-width' property
     <td><dfn>border-image-width</dfn>
   <tr>
     <th><a href="#values">Value</a>:
-    <td>[ <var>&lt;length&gt;</var> | <var>&lt;percentage&gt;</var> | <var>&lt;number&gt;</var> | auto ]{1,4}
+    <td>[ <var>&lt;length-percentage&gt;</var> | <var>&lt;number&gt;</var> | auto ]{1,4}
   <tr>
     <th>Initial:
     <td>1
@@ -3447,13 +3446,13 @@ <h3 id="changes-2011">
     verbose but easier to understand.
     <blockquote>
     <pre class=prod><del>bg-position</del><ins>&lt;position&gt;</ins> = [
-  [ <ins>left | center | right |</ins> top | bottom <ins>| <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var></ins> ]
+  [ <ins>left | center | right |</ins> top | bottom <ins>| <var>&lt;length-percentage&gt;</var></ins> ]
 |
-  [ left | center | right | <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> ]
-  [ top | center | bottom | <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> ]<del>?</del>
+  [ left | center | right | <var>&lt;length-percentage&gt;</var> ]
+  [ top | center | bottom | <var>&lt;length-percentage&gt;</var> ]<del>?</del>
 |
-  [ center | [ left | right ] [ <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> ]? ] &amp;&amp;
-  [ center | [ top | bottom ] [ <var>&lt;percentage&gt;</var> | <var>&lt;length&gt;</var> ]? ]
+  [ center | [ left | right ] <var>&lt;length-percentage&gt;</var>? ] &amp;&amp;
+  [ center | [ top | bottom ] <var>&lt;length-percentage&gt;</var>? ]
 ]</pre>
     </blockquote>
   <li><a href="#the-border-image-repeat">Section 6.5</a>: