[css3-transforms] Fix syntax of transform-origin/perspective-origin properties.
authorDirk Schulze <dschulze@adobe.com>
Mon, 25 Mar 2013 12:06:12 -0700
changeset 7808546a3f53d20e
parent 7807 586efdae1e9b
child 7809 2a3ae65ab0c8
[css3-transforms] Fix syntax of transform-origin/perspective-origin properties.
css3-transforms/ChangeLog
css3-transforms/Overview.html
css3-transforms/Transforms.src.html
     1.1 --- a/css3-transforms/ChangeLog	Sat Mar 23 14:59:10 2013 -0700
     1.2 +++ b/css3-transforms/ChangeLog	Mon Mar 25 12:06:12 2013 -0700
     1.3 @@ -1,3 +1,6 @@
     1.4 +2013-03-25  Dirk Schulze  <dschulze@adobe.com>
     1.5 +    Fix syntax of transform-origin/perspective-origin properties.
     1.6 +
     1.7  2013-03-11  Dirk Schulze  <dschulze@adobe.com>
     1.8      Add conformance section.
     1.9  
     2.1 --- a/css3-transforms/Overview.html	Sat Mar 23 14:59:10 2013 -0700
     2.2 +++ b/css3-transforms/Overview.html	Mon Mar 25 12:06:12 2013 -0700
     2.3 @@ -7,17 +7,20 @@
     2.4    <meta content="text/html; charset=utf-8" http-equiv=Content-Type>
     2.5    <title>CSS Transforms</title>
     2.6  
     2.7 -  <link href="http://purl.org/dc/terms/" rel=schema.dcterms>
     2.8 +  <link href="http://purl.org/dc/terms/" rel=schema.dc>
     2.9    <link href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright"
    2.10 -   rel=dcterms.rights>
    2.11 -  <meta content="CSS Transforms" name=dcterms.title>
    2.12 -  <meta content=text name=dcterms.type>
    2.13 -  <meta content=2013-03-12 name=dcterms.issued>
    2.14 +   rel=dc.rights>
    2.15 +  <meta content="CSS Transforms" name=dc.title>
    2.16 +  <meta content=text name=dc.type>
    2.17 +  <meta content=2013-03-25 name=dc.date>
    2.18 +  <meta content="Simon Fraser" name=dc.creator>
    2.19 +  <meta content="Dean Jackson" name=dc.creator>
    2.20 +  <meta content="Edward O'Connor" name=dc.creator>
    2.21 +  <meta content="Dirk Schulze" name=dc.creator>
    2.22 +  <meta content="Aryeh Gregor" name=dc.creator>
    2.23 +  <meta content=W3C name=dc.publisher>
    2.24    <meta content="http://dev.w3.org/csswg/css3-transforms/"
    2.25 -   name=dcterms.creator>
    2.26 -  <meta content=W3C name=dcterms.publisher>
    2.27 -  <meta content="http://dev.w3.org/csswg/css3-transforms/"
    2.28 -   name=dcterms.identifier>
    2.29 +   name=dc.identifier>
    2.30    <link href="../default.css" rel=stylesheet type="text/css">
    2.31    <script defer=defer
    2.32     src="http://test.csswg.org/harness/annotate.js#CSS3-TRANSFORMS_DEV"
    2.33 @@ -37,14 +40,14 @@
    2.34  
    2.35     <h1>CSS Transforms</h1>
    2.36  
    2.37 -   <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 12 March 2013</h2>
    2.38 +   <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 25 March 2013</h2>
    2.39  
    2.40     <dl>
    2.41      <dt>This version:
    2.42  
    2.43      <dd> <a
    2.44       href="http://dev.w3.org/csswg/css3-transforms/">http://dev.w3.org/csswg/css3-transforms/</a>
    2.45 -     <!--http://www.w3.org/TR/2013/WD-css3-transforms-20130312/-->
    2.46 +     <!--http://www.w3.org/TR/2013/WD-css3-transforms-20130325/-->
    2.47  
    2.48      <dt>Latest version:
    2.49  
    2.50 @@ -1387,14 +1390,13 @@
    2.51      <tr>
    2.52       <td> <em>Value:</em>
    2.53  
    2.54 -     <td> [ &lt;percentage> | &lt;length> | left | center | right | top |
    2.55 -      bottom]<br>
    2.56 +     <td>   [ left | center | right | top | bottom |
    2.57 +      <var>&lt;percentage></var> | <var>&lt;length></var> ]<br>
    2.58        |<br>
    2.59 -      [<br>
    2.60 -        [ &lt;percentage> | &lt;length&gt; | left | center | right ]<br>
    2.61 -        &amp;&amp;<br>
    2.62 -        [ &lt;percentage> | &lt;length&gt; | top | center | bottom ]<br>
    2.63 -      ] &lt;length&gt;?<br>
    2.64 +        [ left | center | right | <var>&lt;percentage></var> |
    2.65 +      <var>&lt;length></var> ]<br>
    2.66 +        [ top | center | bottom | <var>&lt;percentage></var> |
    2.67 +      <var>&lt;length></var> ] <var>&lt;length></var>?
    2.68  
    2.69      <tr>
    2.70       <td> <em>Initial:</em>
    2.71 @@ -1480,30 +1482,35 @@
    2.72       and vertical offset represent an offset from the point of origin of the
    2.73       element's local coordinate space.
    2.74  
    2.75 -   <dt><dfn id=top title="''top''!!'transform-origin' value">‘<code
    2.76 +   <dt><dfn id=lsquotoprsquo
    2.77 +    title="''top''!!'transform-origin' value">‘<code
    2.78      class=css>top</code>’</dfn>
    2.79  
    2.80     <dd>Computes to ‘<code class=css>0%</code>’ for the vertical position.
    2.81  
    2.82 -   <dt><dfn id=right title="''right''!!'transform-origin' value">‘<code
    2.83 +   <dt><dfn id=lsquorightrsquo
    2.84 +    title="''right''!!'transform-origin' value">‘<code
    2.85      class=css>right</code>’</dfn>
    2.86  
    2.87     <dd>Computes to ‘<code class=css>100%</code>’ for the horizontal
    2.88      position.
    2.89  
    2.90 -   <dt><dfn id=bottom title="''bottom''!!'transform-origin' value">‘<code
    2.91 +   <dt><dfn id=lsquobottomrsquo
    2.92 +    title="''bottom''!!'transform-origin' value">‘<code
    2.93      class=css>bottom</code>’</dfn>
    2.94  
    2.95     <dd>Computes to ‘<code class=css>100%</code>’ for the vertical
    2.96      position.
    2.97  
    2.98 -   <dt><dfn id=left title="''left''!!'transform-origin' value">‘<code
    2.99 +   <dt><dfn id=lsquoleftrsquo
   2.100 +    title="''left''!!'transform-origin' value">‘<code
   2.101      class=css>left</code>’</dfn>
   2.102  
   2.103     <dd>Computes to ‘<code class=css>0%</code>’ for the horizontal
   2.104      position.
   2.105  
   2.106 -   <dt><dfn id=center title="''center''!!'transform-origin' value">‘<code
   2.107 +   <dt><dfn id=lsquocenterrsquo
   2.108 +    title="''center''!!'transform-origin' value">‘<code
   2.109      class=css>center</code>’</dfn>
   2.110  
   2.111     <dd>Computes to ‘<code class=css>50%</code>’ (‘<code class=css>left
   2.112 @@ -1693,14 +1700,13 @@
   2.113      <tr>
   2.114       <td> <em>Value:</em>
   2.115  
   2.116 -     <td> [ &lt;percentage> | &lt;length> | left | center | right | top |
   2.117 -      bottom]<br>
   2.118 +     <td>   [ left | center | right | top | bottom |
   2.119 +      <var>&lt;percentage></var> | <var>&lt;length></var> ]<br>
   2.120        |<br>
   2.121 -      [<br>
   2.122 -        [ &lt;percentage> | &lt;length&gt; | left | center | right ]<br>
   2.123 -        &amp;&amp;<br>
   2.124 -        [ &lt;percentage> | &lt;length&gt; | top | center | bottom ]<br>
   2.125 -      ]<br>
   2.126 +        [ left | center | right | <var>&lt;percentage></var> |
   2.127 +      <var>&lt;length></var> ]<br>
   2.128 +        [ top | center | bottom | <var>&lt;percentage></var> |
   2.129 +      <var>&lt;length></var> ]
   2.130  
   2.131      <tr>
   2.132       <td> <em>Initial:</em>
   2.133 @@ -1780,31 +1786,34 @@
   2.134       horizontal and vertical offset represent an offset from the top left
   2.135       corner of the <a href="#bounding-box"><var>bounding box</var></a>.
   2.136  
   2.137 -   <dt><dfn id=top0 title="''top''!!'perspective-origin' value">‘<code
   2.138 +   <dt><dfn id=lsquotoprsquo0
   2.139 +    title="''top''!!'perspective-origin' value">‘<code
   2.140      class=css>top</code>’</dfn>
   2.141  
   2.142     <dd>Computes to ‘<code class=css>0%</code>’ for the vertical position.
   2.143  
   2.144 -   <dt><dfn id=right0 title="''right''!!'perspective-origin' value">‘<code
   2.145 +   <dt><dfn id=lsquorightrsquo0
   2.146 +    title="''right''!!'perspective-origin' value">‘<code
   2.147      class=css>right</code>’</dfn>
   2.148  
   2.149     <dd>Computes to ‘<code class=css>100%</code>’ for the horizontal
   2.150      position.
   2.151  
   2.152 -   <dt><dfn id=bottom0
   2.153 +   <dt><dfn id=lsquobottomrsquo0
   2.154      title="''bottom''!!'perspective-origin' value">‘<code
   2.155      class=css>bottom</code>’</dfn>
   2.156  
   2.157     <dd>Computes to ‘<code class=css>100%</code>’ for the vertical
   2.158      position.
   2.159  
   2.160 -   <dt><dfn id=left0 title="''left''!!'perspective-origin' value">‘<code
   2.161 +   <dt><dfn id=lsquoleftrsquo0
   2.162 +    title="''left''!!'perspective-origin' value">‘<code
   2.163      class=css>left</code>’</dfn>
   2.164  
   2.165     <dd>Computes to ‘<code class=css>0%</code>’ for the horizontal
   2.166      position.
   2.167  
   2.168 -   <dt><dfn id=center0
   2.169 +   <dt><dfn id=lsquocenterrsquo0
   2.170      title="''center''!!'perspective-origin' value">‘<code
   2.171      class=css>center</code>’</dfn>
   2.172  
   2.173 @@ -3620,10 +3629,10 @@
   2.174      <tr>
   2.175       <th><a class=property href="#perspective-origin">perspective-origin</a>
   2.176  
   2.177 -     <td>[ &lt;percentage> | &lt;length> | left | center | right | top |
   2.178 -      bottom] | [   [ &lt;percentage> | &lt;length&gt; | left | center |
   2.179 -      right ]   &amp;&amp;   [ &lt;percentage> | &lt;length&gt; | top |
   2.180 -      center | bottom ] ]
   2.181 +     <td>  [ left | center | right | top | bottom | &lt;percentage> |
   2.182 +      &lt;length> ] |   [ left | center | right | &lt;percentage> |
   2.183 +      &lt;length> ]   [ top | center | bottom | &lt;percentage> |
   2.184 +      &lt;length> ]
   2.185  
   2.186       <td>50% 50%
   2.187  
   2.188 @@ -3653,10 +3662,10 @@
   2.189      <tr>
   2.190       <th><a class=property href="#transform-origin">transform-origin</a>
   2.191  
   2.192 -     <td>[ &lt;percentage> | &lt;length> | left | center | right | top |
   2.193 -      bottom] | [   [ &lt;percentage> | &lt;length&gt; | left | center |
   2.194 -      right ]   &amp;&amp;   [ &lt;percentage> | &lt;length&gt; | top |
   2.195 -      center | bottom ] ] &lt;length&gt;?
   2.196 +     <td>  [ left | center | right | top | bottom | &lt;percentage> |
   2.197 +      &lt;length> ] |   [ left | center | right | &lt;percentage> |
   2.198 +      &lt;length> ]   [ top | center | bottom | &lt;percentage> |
   2.199 +      &lt;length> ] &lt;length>?
   2.200  
   2.201       <td>50% 50%
   2.202  
   2.203 @@ -3702,28 +3711,24 @@
   2.204     <li>backface-visibility, <a href="#backface-visibility"
   2.205      title="section 12."><strong>12.</strong></a>
   2.206  
   2.207 -   <li>‘<code class=css>bottom</code>’
   2.208 +   <li>''bottom''
   2.209      <ul>
   2.210 -     <li>‘<a href="#perspective-origin"><code
   2.211 -      class=property>perspective-origin</code></a>’ value, <a
   2.212 -      href="#bottom0" title="section 11."><strong>11.</strong></a>
   2.213 -
   2.214 -     <li>‘<a href="#transform-origin"><code
   2.215 -      class=property>transform-origin</code></a>’ value, <a href="#bottom"
   2.216 +     <li>'perspective-origin' value, <a href="#lsquobottomrsquo0"
   2.217 +      title="section 11."><strong>11.</strong></a>
   2.218 +
   2.219 +     <li>'transform-origin' value, <a href="#lsquobottomrsquo"
   2.220        title="section 8."><strong>8.</strong></a>
   2.221      </ul>
   2.222  
   2.223     <li>bounding box, <a href="#bounding-box"
   2.224      title="section 4."><strong>4.</strong></a>
   2.225  
   2.226 -   <li>‘<code class=css>center</code>’
   2.227 +   <li>''center''
   2.228      <ul>
   2.229 -     <li>‘<a href="#perspective-origin"><code
   2.230 -      class=property>perspective-origin</code></a>’ value, <a
   2.231 -      href="#center0" title="section 11."><strong>11.</strong></a>
   2.232 -
   2.233 -     <li>‘<a href="#transform-origin"><code
   2.234 -      class=property>transform-origin</code></a>’ value, <a href="#center"
   2.235 +     <li>'perspective-origin' value, <a href="#lsquocenterrsquo0"
   2.236 +      title="section 11."><strong>11.</strong></a>
   2.237 +
   2.238 +     <li>'transform-origin' value, <a href="#lsquocenterrsquo"
   2.239        title="section 8."><strong>8.</strong></a>
   2.240      </ul>
   2.241  
   2.242 @@ -3734,14 +3739,12 @@
   2.243     <li>identity transform function, <a href="#identity-transform-function"
   2.244      title="section 4."><strong>4.</strong></a>
   2.245  
   2.246 -   <li>‘<code class=css>left</code>’
   2.247 +   <li>''left''
   2.248      <ul>
   2.249 -     <li>‘<a href="#perspective-origin"><code
   2.250 -      class=property>perspective-origin</code></a>’ value, <a href="#left0"
   2.251 +     <li>'perspective-origin' value, <a href="#lsquoleftrsquo0"
   2.252        title="section 11."><strong>11.</strong></a>
   2.253  
   2.254 -     <li>‘<a href="#transform-origin"><code
   2.255 -      class=property>transform-origin</code></a>’ value, <a href="#left"
   2.256 +     <li>'transform-origin' value, <a href="#lsquoleftrsquo"
   2.257        title="section 8."><strong>8.</strong></a>
   2.258      </ul>
   2.259  
   2.260 @@ -3760,14 +3763,12 @@
   2.261     <li>renderer, <a href="#renderer"
   2.262      title="section 22."><strong>22.</strong></a>
   2.263  
   2.264 -   <li>‘<code class=css>right</code>’
   2.265 +   <li>''right''
   2.266      <ul>
   2.267 -     <li>‘<a href="#perspective-origin"><code
   2.268 -      class=property>perspective-origin</code></a>’ value, <a
   2.269 -      href="#right0" title="section 11."><strong>11.</strong></a>
   2.270 -
   2.271 -     <li>‘<a href="#transform-origin"><code
   2.272 -      class=property>transform-origin</code></a>’ value, <a href="#right"
   2.273 +     <li>'perspective-origin' value, <a href="#lsquorightrsquo0"
   2.274 +      title="section 11."><strong>11.</strong></a>
   2.275 +
   2.276 +     <li>'transform-origin' value, <a href="#lsquorightrsquo"
   2.277        title="section 8."><strong>8.</strong></a>
   2.278      </ul>
   2.279  
   2.280 @@ -3777,14 +3778,12 @@
   2.281        title="section 22."><strong>22.</strong></a>
   2.282      </ul>
   2.283  
   2.284 -   <li>‘<code class=css>top</code>’
   2.285 +   <li>''top''
   2.286      <ul>
   2.287 -     <li>‘<a href="#perspective-origin"><code
   2.288 -      class=property>perspective-origin</code></a>’ value, <a href="#top0"
   2.289 +     <li>'perspective-origin' value, <a href="#lsquotoprsquo0"
   2.290        title="section 11."><strong>11.</strong></a>
   2.291  
   2.292 -     <li>‘<a href="#transform-origin"><code
   2.293 -      class=property>transform-origin</code></a>’ value, <a href="#top"
   2.294 +     <li>'transform-origin' value, <a href="#lsquotoprsquo"
   2.295        title="section 8."><strong>8.</strong></a>
   2.296      </ul>
   2.297  
     3.1 --- a/css3-transforms/Transforms.src.html	Sat Mar 23 14:59:10 2013 -0700
     3.2 +++ b/css3-transforms/Transforms.src.html	Mon Mar 25 12:06:12 2013 -0700
     3.3 @@ -1118,13 +1118,10 @@
     3.4                        <em>Value:</em>
     3.5                      </td>
     3.6                      <td>
     3.7 -            [ &lt;percentage> | &lt;length> | left | center | right | top | bottom]<br>
     3.8 -            |<br>
     3.9 -            [<br>
    3.10 -            &nbsp;&nbsp;[ &lt;percentage> | &lt;length&gt; | left | center | right ]<br>
    3.11 -            &nbsp;&nbsp;&amp;&amp;<br>
    3.12 -            &nbsp;&nbsp;[ &lt;percentage> | &lt;length&gt; | top | center | bottom ]<br>
    3.13 -            ] &lt;length&gt;?<br>
    3.14 +                      &nbsp;&nbsp;[ left | center | right | top | bottom | <var>&lt;percentage></var> | <var>&lt;length></var> ]<br>
    3.15 +                      |<br>
    3.16 +                      &nbsp;&nbsp;[ left | center | right | <var>&lt;percentage></var> | <var>&lt;length></var> ]<br>
    3.17 +                      &nbsp;&nbsp;[ top | center | bottom | <var>&lt;percentage></var> | <var>&lt;length></var> ] <var>&lt;length></var>?
    3.18                      </td>
    3.19                    </tr>
    3.20                    <tr>
    3.21 @@ -1492,13 +1489,10 @@
    3.22                        <em>Value:</em>
    3.23                      </td>
    3.24                      <td>
    3.25 -            [ &lt;percentage> | &lt;length> | left | center | right | top | bottom]<br>
    3.26 -            |<br>
    3.27 -            [<br>
    3.28 -            &nbsp;&nbsp;[ &lt;percentage> | &lt;length&gt; | left | center | right ]<br>
    3.29 -            &nbsp;&nbsp;&amp;&amp;<br>
    3.30 -            &nbsp;&nbsp;[ &lt;percentage> | &lt;length&gt; | top | center | bottom ]<br>
    3.31 -            ]<br>
    3.32 +                      &nbsp;&nbsp;[ left | center | right | top | bottom | <var>&lt;percentage></var> | <var>&lt;length></var> ]<br>
    3.33 +                      |<br>
    3.34 +                      &nbsp;&nbsp;[ left | center | right | <var>&lt;percentage></var> | <var>&lt;length></var> ]<br>
    3.35 +                      &nbsp;&nbsp;[ top | center | bottom | <var>&lt;percentage></var> | <var>&lt;length></var> ]
    3.36                      </td>
    3.37                    </tr>
    3.38                    <tr>