Fixed syntax error in radial-gradient() definition.

Added 'none' and 'scale-down' to object-fit.

Author: tabatkins

css3-images/Overview.html

@@ -5,11 +5,13 @@
 
   <title>CSS Image Values and Replaced Content Module Level 3</title>
   <link href="../default.css" rel=stylesheet type="text/css">
+  <link href="http://dev.w3.org/csswg/default.css" rel=stylesheet>
   <link href="http://www.w3.org/StyleSheets/TR/W3C-ED" rel=stylesheet
   type="text/css">
 
   <style>
 	p { margin: .5em 0; }
+	dd > p { text-indent: 0; }
 	a > b { font-weight: normal; color: #800; }
   </style>
 
@@ -20,12 +22,12 @@
 
    <h1>CSS Image Values and Replaced Content Module Level 3</h1>
 
-   <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 19 January
+   <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 26 January
     2011</h2>
 
    <dl>
     <dt>This version:</dt>
-    <!-- <dd><a href="http://www.w3.org/TR/2011/CR-css3-images-20110119/">http://www.w3.org/TR/2011/CR-css3-images-20110119/</a></dd> -->
+    <!-- <dd><a href="http://www.w3.org/TR/2011/CR-css3-images-20110126/">http://www.w3.org/TR/2011/CR-css3-images-20110126/</a></dd> -->
 
     <dd><a
      href="http://dev.w3.org/csswg/css3-images/">http://dev.w3.org/csswg/css3-images/</a>
@@ -618,6 +620,16 @@ <h2 id=gradients><span class=secno>5. </span>Gradients</h2>
     the size of the background sizing area. If you use a gradient in a
     list-style-image, the "box" will be a 1em square.</p>
 
+   <p class=issue>It has been suggested that repeating gradients aren't
+    necessary, and can instead be achieved by altering the behavior of
+    background-repeat.</p>
+
+   <p class=issue>It has been suggested that we can avoid the center position
+    in radial gradients, and instead use background-position.</p>
+
+   <p class=issue>It has been suggested that we should use some other
+    definition for mapping angles to directions to match other parts of CSS.</p>
+
    <div>
     <h3 id=linear-gradients><span class=secno>5.1. </span>Linear Gradients</h3>
 
@@ -635,7 +647,7 @@ <h4 class=no-toc id=linear-gradient-syntax><span class=secno>5.1.1.
      class=prod><code><dfn id=ltlinear-gradient>&lt;linear-gradient></dfn> = linear-gradient(
 [ 
 	[ [top | bottom] || [left | right] ] 
-	|| 
+	| 
 	&lt;angle>
 ,]? 
 &lt;color-stop>[, &lt;color-stop>]+
@@ -1368,14 +1380,13 @@ <h3 id=image-resolution><span class=secno>6.1. </span>Overriding Image
      resolution of images. Values have the following meanings:
 
     <dl>
-     <dt><dfn id=ltresolution>&lt;resolution></dfn>
+     <dt>&lt;resolution>
 
      <dd>The value sets the resolution of the image. In combination with
-      &lsquo;<a href="#from-image"><code
-      class=css>from-image</code></a>&rsquo;, the specified resolution is
-      only used if the image does not have a resolution.
+      &lsquo;<code class=css>from-image</code>&rsquo;, the specified
+      resolution is only used if the image does not have a resolution.
 
-     <dt><dfn id=from-image>from-image</dfn>
+     <dt>from-image
 
      <dd>The UA must look for the resolution in the image itself. If the
       image does not have a resolution, the specified &lt;resolution> value
@@ -1398,6 +1409,8 @@ <h3 id=image-resolution><span class=secno>6.1. </span>Overriding Image
       resolution in the image, if any, is ignored.
 
      <pre>
+
+
 		  img { image-resolution: 300dpi }
 		  </pre>
     </div>
@@ -1565,15 +1578,15 @@ <h3 id=image-rendering><span class=secno>6.3. </span>Determining How to
      interpreted as follows:</p>
 
     <dl>
-     <dt>&lsquo;<code class=css>auto</code>&rsquo;
+     <dt>auto
 
      <dd>The image should be scaled with an algorithm that maximizes the
       appearance of the image. In particular, scaling algorithms that
       &lsquo;<code class=property>smooth</code>&rsquo; colors are acceptable,
       such as bilinear interpolation. This is intended for images such as
       photos.
 
-     <dt>&lsquo;<code class=css>optimize-contrast</code>&rsquo;
+     <dt>optimize-contrast
 
      <dd>The image should be scaled with an algorithm that maximizes the
       contrast of the image, preserving sharp lines and not smoothing colors
@@ -1614,7 +1627,7 @@ <h3 id=object-fit><span class=secno>6.4. </span>Sizing Replaced Elements:
       <tr>
        <th>Value:
 
-       <td>fill | contain | cover
+       <td>fill | contain | cover | none
 
       <tr>
        <th>Initial:
@@ -1662,53 +1675,73 @@ <h3 id=object-fit><span class=secno>6.4. </span>Sizing Replaced Elements:
     <dl>
      <dt>fill
 
-     <dd>Determine the used &lsquo;<code class=property>height</code>&rsquo;
-      and &lsquo;<code class=property>width</code>&rsquo; <a
-      href="/TR/CSS21/visudet.html">as usual</a>. Scale the content height
-      and width independently so that the edges of the content just meet the
-      edges of the box established by the used &lsquo;<code
-      class=property>height</code>&rsquo; and &lsquo;<code
-      class=property>width</code>&rsquo;.
+     <dd>
+      <p>Determine the used &lsquo;<code class=property>height</code>&rsquo;
+       and &lsquo;<code class=property>width</code>&rsquo; <a
+       href="/TR/CSS21/visudet.html">as usual</a>. Scale the content height
+       and width independently so that the edges of the content just meet the
+       edges of the box established by the used &lsquo;<code
+       class=property>height</code>&rsquo; and &lsquo;<code
+       class=property>width</code>&rsquo;.</p>
 
      <dt>contain
 
-     <dd>Determine the used &lsquo;<code class=property>height</code>&rsquo;
-      and &lsquo;<code class=property>width</code>&rsquo; <a
-      href="/TR/CSS21/visudet.html">as usual</a>, except if both &lsquo;<code
-      class=property>height</code>&rsquo; and &lsquo;<code
-      class=property>width</code>&rsquo; are &lsquo;<code
-      class=property>auto</code>&rsquo;, and the used value of at least one
-      of &lsquo;<code class=property>max-width</code>&rsquo; and &lsquo;<code
-      class=property>max-height</code>&rsquo; is not &lsquo;<code
-      class=property>none</code>&rsquo;, then compute the element's used
-      width and used height as though the intrinsic dimensions of the
-      contents were infinitely large numbers whose ratio is the actual
-      intrinsic ratio of the contents.
-
-     <dd>Scale the contents of the element, preserving their aspect ratio, to
-      the largest size such that the width of the contents is less than or
-      equal to the used width of the box and the height of the contents is
-      less than or equal to the used height of the box.
+     <dd>
+      <p>Determine the used &lsquo;<code class=property>height</code>&rsquo;
+       and &lsquo;<code class=property>width</code>&rsquo; <a
+       href="/TR/CSS21/visudet.html">as usual</a>, except if both
+       &lsquo;<code class=property>height</code>&rsquo; and &lsquo;<code
+       class=property>width</code>&rsquo; are &lsquo;<code
+       class=css>auto</code>&rsquo;, and the used value of at least one of
+       &lsquo;<code class=property>max-width</code>&rsquo; and &lsquo;<code
+       class=property>max-height</code>&rsquo; is not &lsquo;<code
+       class=property>none</code>&rsquo;, then compute the element's used
+       width and used height as though the intrinsic dimensions of the
+       contents were infinitely large numbers whose ratio is the actual
+       intrinsic ratio of the contents.</p>
+
+      <p>Scale the contents of the element, preserving their aspect ratio, to
+       the largest size such that the width of the contents is less than or
+       equal to the used width of the box and the height of the contents is
+       less than or equal to the used height of the box.</p>
 
      <dt>cover
 
-     <dd>Determine the used &lsquo;<code class=property>height</code>&rsquo;
-      and &lsquo;<code class=property>width</code>&rsquo; <a
-      href="/TR/CSS21/visudet.html">as usual</a>, except if both &lsquo;<code
-      class=property>height</code>&rsquo; and &lsquo;<code
-      class=property>width</code>&rsquo; are &lsquo;<code
-      class=property>auto</code>&rsquo;, and the used value of at least one
-      of &lsquo;<code class=property>min-width</code>&rsquo; and &lsquo;<code
-      class=property>min-height</code>&rsquo; is not &lsquo;<code
-      class=css>0</code>&rsquo;, then compute the used width and used height
-      of the element as though the intrinsic dimensions of the contents were
-      infinitesimally small numbers whose ratio is the actual intrinsic ratio
-      of the contents.
-
-     <dd>Scale the contents of the element, preserving their aspect ratio, to
-      the smallest size such that the width of the contents is greater than
-      or equal to the used width of the box and the height of the contents is
-      greater than or equal to the height of the box.
+     <dd>
+      <p>Determine the used &lsquo;<code class=property>height</code>&rsquo;
+       and &lsquo;<code class=property>width</code>&rsquo; <a
+       href="/TR/CSS21/visudet.html">as usual</a>, except if both
+       &lsquo;<code class=property>height</code>&rsquo; and &lsquo;<code
+       class=property>width</code>&rsquo; are &lsquo;<code
+       class=css>auto</code>&rsquo;, and the used value of at least one of
+       &lsquo;<code class=property>min-width</code>&rsquo; and &lsquo;<code
+       class=property>min-height</code>&rsquo; is not &lsquo;<code
+       class=css>0</code>&rsquo;, then compute the used width and used height
+       of the element as though the intrinsic dimensions of the contents were
+       infinitesimally small numbers whose ratio is the actual intrinsic
+       ratio of the contents.</p>
+
+      <p>Scale the contents of the element, preserving their aspect ratio, to
+       the smallest size such that the width of the contents is greater than
+       or equal to the used width of the box and the height of the contents
+       is greater than or equal to the height of the box.</p>
+
+     <dt>none
+
+     <dd>
+      <p>Determine the used &lsquo;<code class=property>height</code>&rsquo;
+       and &lsquo;<code class=property>width</code>&rsquo; <a
+       href="/TR/CSS21/visudet.html">as usual</a>. If the content has an
+       intrinsic height and width, do not scale it. Otherwise, this value
+       must be treated as &lsquo;<code class=css>fill</code>&rsquo;.</p>
+
+     <dt>scale-down <b class=issue>better name?</b>
+
+     <dd>
+      <p>This value must act identically to &lsquo;<code
+       class=css>none</code>&rsquo; or &lsquo;<code
+       class=css>contain</code>&rsquo;, whichever would make the contents
+       smaller.</p>
     </dl>
 
     <p>The &lsquo;<code class=property>overflow</code>&rsquo; property
@@ -1831,9 +1864,8 @@ <h2 id=serialization><span class=secno>7. </span>Serialization</h2>
     <h3 id=serializing-resolution><span class=secno>7.1. </span>Serializing a
      &lt;resolution></h3>
 
-    <p>The serialization of the <a
-     href="#ltresolution"><b>&lt;resolution></b></a> value type is defined in
-     the CSSOM spec.</p>
+    <p>The serialization of the <b>&lt;resolution></b> value type is defined
+     in the CSSOM spec.</p>
 
     <p class=note>This spec defines several new units for resolutions. These
      can all be converted to the canonical "dpcm" unit that CSSOM defines the
@@ -2055,13 +2087,11 @@ <h3 id=serializing-properties><span class=secno>7.7. </span>Serializing
      class=property>image-resolution</code></a>&rsquo; property:
 
     <ol>
-     <li>If the &lsquo;<a href="#from-image"><code
-      class=css>from-image</code></a>&rsquo; keyword is specified in the
-      property value, append "from-image" to s.
+     <li>If the &lsquo;<code class=css>from-image</code>&rsquo; keyword is
+      specified in the property value, append "from-image" to s.
 
-     <li>If both the &lsquo;<a href="#from-image"><code
-      class=css>from-image</code></a>&rsquo; keyword and a &lt;resolution>
-      are specified, append a space " " to s.
+     <li>If both the &lsquo;<code class=css>from-image</code>&rsquo; keyword
+      and a &lt;resolution> are specified, append a space " " to s.
 
      <li>If a &lt;resolution is specified, serialize it and append it to s.
     </ol>