ACTION-3576: Make width and height attributes presentation attributes on the svg element.
authorErik Dahlström <ed@opera.com>
Thu, 10 Apr 2014 16:59:23 +0200
changeset 653 6dc0cdba8335
parent 652 cf6f0f844e40
child 654 52cad72e3144
ACTION-3576: Make width and height attributes presentation attributes on the svg element.
master/changes.html
master/coords.html
master/definitions.xml
master/struct.html
--- a/master/changes.html	Thu Apr 10 14:08:21 2014 +0200
+++ b/master/changes.html	Thu Apr 10 16:59:23 2014 +0200
@@ -126,6 +126,9 @@
   <li>Changed the <a>'use'</a> element event flow to follow the Shadow DOM spec.</li>
   
   <li>Clarified that the <a>'switch'</a> element does not affect processing of <a>'script'</a> elements.</li>
+
+  <li>Made the <a>'svg/width'</a> and <a>'svg/height'</a> attributes on the <a>'svg'</a> element presentation attributes, and changed the lacuna value to
+   <span class="attr-value">auto</span>.</li>
 </ul>
 
 <h3 id="styling">Styling chapter</h3>
--- a/master/coords.html	Thu Apr 10 14:08:21 2014 +0200
+++ b/master/coords.html	Thu Apr 10 16:59:23 2014 +0200
@@ -1464,15 +1464,11 @@
 
 <p>SVG needs to specify how to calculate some intrinsic sizing properties  to
 enable inclusion within other languages. The intrinsic width and height
-of the <a>viewport</a> of SVG content must be determined from the <a>'svg/width'</a>
-and <a>'svg/height'</a> attributes.  If either of these are not specified, a
-value of <span class="attr-value">'100%'</span> must be assumed.
-<em>Note:</em> the <a>'svg/width'</a> and <a>'svg/height'</a>
-attributes are <em>not the same</em> as the CSS width and height properties.
-Specifically, percentage values <em>do not provide an intrinsic width or height,
-and do not indicate a percentage of the containing block</em>. Rather, once the
-viewport is established, they indicate the portion of the viewport that is
-actually covered by image data.</p>
+of the <a>viewport</a> of SVG content must be determined from the <a>'width property'</a>
+and <a>'height property'</a> presentation attributes.  If either of these are not specified, a
+value of <span class="attr-value">'auto'</span> must be assumed.
+Specifically, percentage values <em>do not provide an intrinsic width or height.</em>.
+</p>
 
 <p>The intrinsic aspect ratio of the <a>viewport</a> of SVG content is necessary
 for example, when including SVG from an <span class="element-name">'object'</span> element in HTML styled with
@@ -1503,7 +1499,7 @@
 </div>
 
 <div class="examplesource">
-<pre><![CDATA[<svg xmlns="http://www.w3.org/2000/svg" version="1.2" baseProfile="tiny"
+<pre><![CDATA[<svg xmlns="http://www.w3.org/2000/svg"
      width="10cm" height="5cm">
   ...
 </svg>]]></pre>
@@ -1519,7 +1515,7 @@
 </div>
 
 <div class="examplesource">
-<pre><![CDATA[<svg xmlns="http://www.w3.org/2000/svg" version="1.2" baseProfile="tiny"
+<pre><![CDATA[<svg xmlns="http://www.w3.org/2000/svg"
      width="100%" height="50%" viewBox="0 0 200 200">
   ...
 </svg>]]></pre>
@@ -1536,7 +1532,7 @@
 </div>
 
 <div class="examplesource">
-<pre><![CDATA[<svg xmlns="http://www.w3.org/2000/svg" version="1.2" baseProfile="tiny"
+<pre><![CDATA[<svg xmlns="http://www.w3.org/2000/svg"
      width="10cm" viewBox="0 0 200 200">
   ...
 </svg>]]></pre>
@@ -1551,7 +1547,7 @@
 </div>
 
 <div class="examplesource">
-<pre><![CDATA[<svg xmlns="http://www.w3.org/2000/svg" version="1.2" baseProfile="tiny"
+<pre><![CDATA[<svg xmlns="http://www.w3.org/2000/svg"
      width="75%" height="10cm" viewBox="0 0 200 200">
   ...
 </svg>]]></pre>
@@ -1560,7 +1556,9 @@
 
 <p>In this example, the intrinsic aspect ratio is 1:1.</p>
 
-
+<p class="issue">Add more examples for the new auto value? E.g some of the 
+<a href="https://docs.google.com/presentation/d/1POUiroOBbLmXYlQKf0pIR8zVkHWH9jRVN-w8A4aNsIk/">examples</a>
+provided by David Vest.</p>
 
 <h2 id="GeographicCoordinates">Geographic coordinate systems</h2>
 
--- a/master/definitions.xml	Thu Apr 10 14:08:21 2014 +0200
+++ b/master/definitions.xml	Thu Apr 10 16:59:23 2014 +0200
@@ -706,8 +706,8 @@
       interfaces='SVGSVGElement'>
     <attribute name='x' href='struct.html#SVGElementXAttribute' animatable='yes'/>
     <attribute name='y' href='struct.html#SVGElementYAttribute' animatable='yes'/>
-    <attribute name='width' href='struct.html#SVGElementWidthAttribute' animatable='yes'/>
-    <attribute name='height' href='struct.html#SVGElementHeightAttribute' animatable='yes'/>
+    <attribute name='width' href='struct.html#SVGElementWidthAttribute' animatable='yes' presentation='yes'/>
+    <attribute name='height' href='struct.html#SVGElementHeightAttribute' animatable='yes' presentation='yes'/>
     <attribute name='version' href='struct.html#SVGElementVersionAttribute'/>
     <attribute name='baseProfile' href='struct.html#SVGElementBaseProfileAttribute'/>
     <attribute name='playbackOrder' href='struct.html#SVGElementPlaybackOrderAttribute' animatable='no'/>
--- a/master/struct.html	Thu Apr 10 14:08:21 2014 +0200
+++ b/master/struct.html	Thu Apr 10 16:59:23 2014 +0200
@@ -368,16 +368,17 @@
       </tr>
       <tr>
         <td><dfn data-dfn-type="element-attr" data-dfn-for="svg" id="SVGElementWidthAttribute">width</dfn>, <dfn data-dfn-type="element-attr" data-dfn-for="svg" id="SVGElementHeightAttribute">height</dfn></td>
-        <td><a>&lt;length&gt;</a> | <a>&lt;percentage&gt;</a></td>
-        <td>100%</td>
+        <td>See <a>'width property'</a> and <a>'height property'</a></td>
+        <td>auto</td>
         <td>yes</td>
       </tr>
     </table>
   </dt>
   <dd>
+    <p class="note">Note that <a>'width'</a> and <a>'height'</a> are presentation attributes.</p>
     <p>For <a>outermost svg elements</a>,
-    the <a>'width'</a> and <a>'height'</a> attributes specify
-    the intrinsice size of the SVG document fragment.
+    the <a>'width property'</a> and <a>'height property'</a> attributes specify
+    the intrinsic size of the SVG document fragment.
     For embedded <a>'svg'</a> elements, they specify the size
     of the rectangular region into which the <a>'svg'</a> element
     is placed.</p>
@@ -2500,6 +2501,7 @@
 <div>
 Corresponds to attribute <a>'width'</a> on the given <a>'svg'</a>
 element.
+<p class="issue">What value should be returned here (since this is now a presentation attribute)?</p>
 
 </div>
 </dd>
@@ -2509,6 +2511,7 @@
 <div>
 Corresponds to attribute <a>'height'</a> on the given <a>'svg'</a>
 element.
+<p class="issue">What value should be returned here (since this is now a presentation attribute)?</p>
 
 </div>
 </dd>