Bunches of typos

Author: tabatkins

css3-images/Overview.html

@@ -272,15 +272,18 @@ <h2 id=intro><span class=secno>1. </span> Introduction</h2>
 
   <p>In CSS Levels 1 and 2, image values, such as those used in the
    &lsquo;<code class=property>background-image</code>&rsquo; property, could
-   only be given by a single URI value. This module introduces additional
-   ways of representing 2D images, for example as a list of URIs denoting
-   fallbacks, as a reference to an element in the document, or as a gradient.
-
-  <p>This module also defines several properties for manipulating raster
-   images and for sizing or positioning replaced elements such as images
+   only be given by a single URL value. This module introduces additional
+   ways of representing 2D images, for example as <a href="#image-notation">a
+   list of URIs denoting fallbacks</a>, as <a href="#element-reference">a
+   reference to an element</a>, or as <a href="#gradients">a gradient</a>.
+
+  <p>This module also defines several properties for <a
+   href="#image-processing">manipulating raster images</a> and for <a
+   href="#object-fit">sizing</a> or <a
+   href="#object-position">positioning</a> replaced elements such as images
    within the box determined by the CSS layout algorithms. It also defines in
-   a generic way CSS's sizing algorithm for images and other replaced
-   elements.
+   a generic way CSS's <a href="#sizing">sizing algorithm</a> for images and
+   other replaced elements.
 
   <h3 id=placement><span class=secno>1.1. </span> Module Interactions</h3>
 
@@ -326,15 +329,15 @@ <h2 id=resolution-units><span class=secno>2. </span> Resolution Units: the
    id=ltresolution>&lt;resolution></dfn> value type:
 
   <dl>
-   <dt><dfn id=dpi>dpi</dfn>
+   <dt><dfn id=dpi>&lsquo;<code class=css>dpi</code>&rsquo;</dfn>
 
    <dd>dots per inch
 
-   <dt><dfn id=dpcm>dpcm</dfn>
+   <dt><dfn id=dpcm>&lsquo;<code class=css>dpcm</code>&rsquo;</dfn>
 
    <dd>dots per centimeter
 
-   <dt><dfn id=dppx>dppx</dfn>
+   <dt><dfn id=dppx>&lsquo;<code class=css>dppx</code>&rsquo;</dfn>
 
    <dd>dots per &lsquo;<code class=css>px</code>&rsquo; unit
   </dl>
@@ -362,8 +365,10 @@ <h2 id=image><span class=secno>3. </span> Image Values: the &lt;image> type</h2>
 
   <p>The &lt;image> value type denotes a 2D image. It is defined as
 
-  <pre class=prod><dfn
-   id=ltimage>&lt;image></dfn> = &lt;url> | &lt;image-list> | &lt;element-reference>  | &lt;gradient></pre>
+  <pre class=prod><dfn id=ltimage>&lt;image></dfn> = <i>&lt;url></i> | <a
+   href="#ltimage-list"><i>&lt;image-list></i></a> | <a
+   href="#ltelement-reference"><i>&lt;element-reference></i></a>  | <a
+   href="#ltgradient"><i>&lt;gradient></i></a></pre>
 
   <p>Image values can be used in many CSS properties, including the
    &lsquo;<code class=property>background-image</code>&rsquo;, &lsquo;<code
@@ -528,7 +533,7 @@ <h3 id=image-notation><span class=secno>3.2. </span> Image Fallbacks and
 
   <div class=example>
    <p>A list may use an arrow for a bullet that points into the content. If
-    the list can contain both ltr and rtl text, though, the bullet may be on
+    the list can contain both LTR and RTL text, though, the bullet may be on
     the left or the right, and an image designed to point into the text on
     one side will point out of the text on the other side. This can be fixed
     with code like:</p>
@@ -545,7 +550,7 @@ <h3 id=image-notation><span class=secno>3.2. </span> Image Fallbacks and
 ⇒ My bullet is on the left!
   !THGIR EHT NO SI TELLUB YM ⇐</pre>
 
-   <p>In ltr list items, the image will be used as-is. In the rtl list items,
+   <p>In LTR list items, the image will be used as-is. In the RTL list items,
     however, it will be flipped in the inline direction, so it still points
     into the content.</p>
   </div>
@@ -894,13 +899,18 @@ <h4 class=no-toc id=linear-gradient-syntax><span class=secno>4.1.1. </span>
    identically, except in the opposite direction of the angle.
 
   <p>Alternately, the direction may be specified with keywords that denote
-   the direction. If the argument is "to top", "to right", "to bottom", or
-   "to left", the gradient must be rendered identically to "0deg", "90deg",
-   "180deg", or "270deg", respectively. If the argument specifies a corner to
-   angle towards, the gradient must be rendered identically to an angle-based
-   gradient with an angle chosen such that the endpoint of the gradient is in
-   the same quadrant as the indicated corner, and a line drawn perpendicular
-   to the gradient-line through the center of the <a
+   the direction. If the argument is &lsquo;<code class=css>to
+   top</code>&rsquo;, &lsquo;<code class=css>to right</code>&rsquo;,
+   &lsquo;<code class=css>to bottom</code>&rsquo;, or &lsquo;<code
+   class=css>to left</code>&rsquo;, the gradient must be rendered identically
+   to &lsquo;<code class=css>0deg</code>&rsquo;, &lsquo;<code
+   class=css>90deg</code>&rsquo;, &lsquo;<code
+   class=css>180deg</code>&rsquo;, or &lsquo;<code
+   class=css>270deg</code>&rsquo;, respectively. If the argument specifies a
+   corner to angle towards, the gradient must be rendered identically to an
+   angle-based gradient with an angle chosen such that the endpoint of the
+   gradient is in the same quadrant as the indicated corner, and a line drawn
+   perpendicular to the gradient-line through the center of the <a
    href="#gradient-box"><i>gradient box</i></a> intersects the two
    neighboring corners.
 
@@ -2082,7 +2092,7 @@ <h3 id=image-resolution><span class=secno>6.1. </span> Overriding Image
    id=intrinsic-resolution>intrinsic resolution</dfn> of an image is used to
    determine the image's <i>intrinsic size</i>. Affected images include
    images in the element's content (e.g. replaced elements and/or generated
-   content), background images,list markers, etc. Values have the following
+   content), background images, list markers, etc. Values have the following
    meanings:
 
   <dl>
@@ -2638,11 +2648,14 @@ <h2 class=no-num id=index>Index</h2>
    <li>default object size, <a href="#default-object-size"
     title="default object size"><strong>5.1.</strong></a>
 
-   <li>dpcm, <a href="#dpcm" title=dpcm><strong>2.</strong></a>
+   <li>&lsquo;<code class=css>dpcm</code>&rsquo;, <a href="#dpcm"
+    title="''dpcm''"><strong>2.</strong></a>
 
-   <li>dpi, <a href="#dpi" title=dpi><strong>2.</strong></a>
+   <li>&lsquo;<code class=css>dpi</code>&rsquo;, <a href="#dpi"
+    title="''dpi''"><strong>2.</strong></a>
 
-   <li>dppx, <a href="#dppx" title=dppx><strong>2.</strong></a>
+   <li>&lsquo;<code class=css>dppx</code>&rsquo;, <a href="#dppx"
+    title="''dppx''"><strong>2.</strong></a>
 
    <li>&lt;element-reference>, <a href="#ltelement-reference"
     title="&lt;element-reference>"><strong>3.3.</strong></a>

css3-images/Overview.src.html

@@ -74,15 +74,15 @@ <h2 id="intro">
 	<p><em>This section is not normative.</em>
 
 	<p>In CSS Levels 1 and 2, image values, such as those used in the
-	'background-image' property, could only be given by a single URI
+	'background-image' property, could only be given by a single URL
 	value. This module introduces additional ways of representing 2D
-	images, for example as a list of URIs denoting fallbacks, as a
-	reference to an element in the document, or as a gradient.</p>
+	images, for example as <a href="#image-notation">a list of URIs denoting fallbacks</a>, as <a href="#element-reference">a
+	reference to an element</a>, or as <a href="#gradients">a gradient</a>.</p>
 
-	<p>This module also defines several properties for manipulating
-	raster images and for sizing or positioning replaced elements
+	<p>This module also defines several properties for <a href="#image-processing">manipulating
+	raster images</a> and for <a href="#object-fit">sizing</a> or <a href="#object-position">positioning</a> replaced elements
 	such as images within the box determined by the CSS layout algorithms.
-	It also defines in a generic way CSS's sizing algorithm for images
+	It also defines in a generic way CSS's <a href="#sizing">sizing algorithm</a> for images
 	and other replaced elements.
 
 <h3 id="placement">
@@ -111,13 +111,13 @@ <h2 id='resolution-units'>
 	value type:</p>
 
 	<dl>
-		<dt><dfn>dpi</dfn></dt>
+		<dt><dfn>''dpi''</dfn></dt>
 		<dd>dots per inch</dd>
 
-		<dt><dfn>dpcm</dfn></dt>
+		<dt><dfn>''dpcm''</dfn></dt>
 		<dd>dots per centimeter</dd>
 
-		<dt><dfn>dppx</dfn></dt> 
+		<dt><dfn>''dppx''</dfn></dt> 
 		<dd>dots per ''px'' unit</dd>
 	</dl>
 
@@ -138,7 +138,7 @@ <h2 id="image">
 
 	<p>The &lt;image> value type denotes a 2D image. It is defined as
 
-	<pre class="prod"><dfn>&lt;image></dfn> = &lt;url> | &lt;image-list> | &lt;element-reference>  | &lt;gradient></pre>
+	<pre class="prod"><dfn>&lt;image></dfn> = <i>&lt;url></i> | <i>&lt;image-list></i> | <i>&lt;element-reference></i>  | <i>&lt;gradient></i></pre>
 
 	<p>Image values can be used in many CSS properties, including the
 	'background-image', 'list-style-image', 'cursor' properties [[!CSS21]].
@@ -247,7 +247,7 @@ <h3 id="image-notation">
 	<p>Along with each URL, the author may specify a directionality, similar to adding a <code>dir</code> attribute to an element in HTML.  The image represented by the function takes on the directionality of the used URL.  If a directional image is used on or in an element with opposite directionality, the image must be flipped in the inline direction (as if it was transformed by, e.g., <code>scaleX(-1)</code>, if the inline direction is the X axis).</p>
 
 	<div class='example'>
-		<p>A list may use an arrow for a bullet that points into the content.  If the list can contain both ltr and rtl text, though, the bullet may be on the left or the right, and an image designed to point into the text on one side will point out of the text on the other side.  This can be fixed with code like:</p>
+		<p>A list may use an arrow for a bullet that points into the content.  If the list can contain both LTR and RTL text, though, the bullet may be on the left or the right, and an image designed to point into the text on one side will point out of the text on the other side.  This can be fixed with code like:</p>
 
 		<pre>
 &lt;ul style="list-style-image: image("arrow.png" ltr);">
@@ -261,7 +261,7 @@ <h3 id="image-notation">
 ⇒ My bullet is on the left!
   !THGIR EHT NO SI TELLUB YM ⇐</pre>
 
-		<p>In ltr list items, the image will be used as-is.  In the rtl list items, however, it will be flipped in the inline direction, so it still points into the content.</p>
+		<p>In LTR list items, the image will be used as-is.  In the RTL list items, however, it will be flipped in the inline direction, so it still points into the content.</p>
 	</div>
 
 <!-- ====================================================================== -->
@@ -524,7 +524,7 @@ <h4 class='no-toc' id='linear-gradient-syntax'>
 	direction.  The starting-point is determined identically, except in the 
 	opposite direction of the angle.</p>
 
-	<p>Alternately, the direction may be specified with keywords that denote the direction.  If the argument is "to top", "to right", "to bottom", or "to left", the gradient must be rendered identically to "0deg", "90deg", "180deg", or "270deg", respectively.  If the argument specifies a corner to angle towards, the gradient must be rendered identically to an angle-based gradient with an angle chosen such that the endpoint of the gradient is in the same quadrant as the indicated corner, and a line drawn perpendicular to the gradient-line through the center of the <i>gradient box</i> intersects the two neighboring corners.</p>
+	<p>Alternately, the direction may be specified with keywords that denote the direction.  If the argument is ''to top'', ''to right'', ''to bottom'', or ''to left'', the gradient must be rendered identically to ''0deg'', ''90deg'', ''180deg'', or ''270deg'', respectively.  If the argument specifies a corner to angle towards, the gradient must be rendered identically to an angle-based gradient with an angle chosen such that the endpoint of the gradient is in the same quadrant as the indicated corner, and a line drawn perpendicular to the gradient-line through the center of the <i>gradient box</i> intersects the two neighboring corners.</p>
 
 	<p class='note'>It is expected that the next level of this module will provide the ability to define the gradient's direction relative to the current text direction and writing-mode.</p>
 
@@ -1375,8 +1375,8 @@ <h3 id="image-resolution">
 	not have an intrinsic resolution, this property has no effect on vector
 	images.) The <dfn>intrinsic resolution</dfn> of an image is used to determine
 	the image's <i>intrinsic size</i>. Affected images include images in the
-	element's content (e.g. replaced elements and/or generated  content),
-	background images,list markers, etc.
+	element's content (e.g. replaced elements and/or generated content),
+	background images, list markers, etc.
 	Values have the following meanings:</p>
 
 	<dl>