[css-device-adapt] Use 100vw/100vh instead of 100% for device-width/height

For viewport meta translation, use vw/vh instead of % to keep the possibilities
to do "width=device-height" and "height=device-width".

Author: Rune Lillesveen

css-device-adapt/Overview.html

@@ -11,7 +11,7 @@
    rel=dcterms.rights>
   <meta content="CSS Device Adaptation" name=dcterms.title>
   <meta content=text name=dcterms.type>
-  <meta content=2013-05-30 name=dcterms.date>
+  <meta content=2013-08-15 name=dcterms.date>
   <meta content="Rune Lillesveen" name=dcterms.creator>
   <meta content="Øyvind Stenhaug" name=dcterms.creator>
   <meta content="Florian Rivoal" name=dcterms.creator>
@@ -30,13 +30,13 @@
 
    <h1>CSS Device Adaptation</h1>
 
-   <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 30 May 2013</h2>
+   <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 15 August 2013</h2>
 
    <dl>
     <dt>This version:
 
     <dd>$Date$ (editor's draft)
-     <!--<dd><a href="http://dev.w3.org/csswg/css-device-adapt/">http://www.w3.org/TR/2013/WD-css-device-adapt-20130530/</a></dd>-->
+     <!--<dd><a href="http://dev.w3.org/csswg/css-device-adapt/">http://www.w3.org/TR/2013/WD-css-device-adapt-20130815/</a></dd>-->
 
     <dt>Latest version:
 
@@ -1819,25 +1819,17 @@ <h4 class="no-num no-toc" id=the-width-and-height-properties>The <code
     title="device-width!!viewport META">device-width</code> and <code
     class=index id=device-height0
     title="device-height!!viewport META">device-height</code> translate to
-    100%
+    100vw and 100vh respectively
 
    <li>Other keywords and unknown values translate to 1px
   </ol>
 
   <p class=note>Some existing UA implementations use device dimensions in CSS
    pixels, and some use the window dimensions (CSS pixels) for device-width /
-   device-height. Above, we translate to 100% which are the window
+   device-height. Above, we translate to 100vw / 100vh which are the window
    dimensions. The rationale is that the device dimensions would not be what
    the author intended for UAs where the window is resizable or does not fill
-   the screen of the device. The rationale for using 100% and not ‘<a
-   href="#auto" title="auto!!length">auto</a>’, is that ‘<a href="#auto"
-   title="auto!!length">auto</a>’ will be affected by a length in the other
-   dimension. That is, <code>@viewport { width: 100%; height: 500px }</code>
-   will resolve width to the window width while <code>@viewport { width:
-   auto; height: 500px }</code> will resolve width from height and the
-   aspect-ratio of the window. A consequence of using percentages instead of
-   device dimensions, is that one cannot use device-height for width or
-   device-width for height.
+   the screen of the device.
 
   <div class=example>
    <p>This <code class=html>META</code> element:
@@ -2095,10 +2087,10 @@ <h3 class=no-num id=normative-references>Normative references</h3>
    <dt id=CSS3VAL>[CSS3VAL]
 
    <dd>Håkon Wium Lie; Tab Atkins; Elika J. Etemad. <a
-    href="http://www.w3.org/TR/2013/CR-css3-values-20130404/"><cite>CSS
-    Values and Units Module Level 3.</cite></a> 4 April 2013. W3C Candidate
+    href="http://www.w3.org/TR/2013/CR-css3-values-20130730/"><cite>CSS
+    Values and Units Module Level 3.</cite></a> 30 July 2013. W3C Candidate
     Recommendation. (Work in progress.) URL: <a
-    href="http://www.w3.org/TR/2013/CR-css3-values-20130404/">http://www.w3.org/TR/2013/CR-css3-values-20130404/</a>
+    href="http://www.w3.org/TR/2013/CR-css3-values-20130730/">http://www.w3.org/TR/2013/CR-css3-values-20130730/</a>
    </dd>
    <!---->
 

css-device-adapt/Overview.src.html

@@ -1457,24 +1457,16 @@ <h4 class="no-num no-toc">The
       <li>Negative number values are dropped</li>
       <li><code class="index" title="device-width!!viewport META">device-width</code>
 	and <code class="index" title="device-height!!viewport META">device-height</code>
-	translate to 100%</li>
+	translate to 100vw and 100vh respectively</li>
       <li>Other keywords and unknown values translate to 1px</li>
     </ol>
 
     <p class="note">Some existing UA implementations use device dimensions in CSS
       pixels, and some use the window dimensions (CSS pixels) for device-width /
-      device-height. Above, we translate to 100% which are the window dimensions.
-      The rationale is that the device dimensions would not be what the author
-      intended for UAs where the window is resizable or does not fill the screen
-      of the device. The rationale for using 100% and not
-      &lsquo;<span title="auto!!length">auto</span>&rsquo;, is that
-      &lsquo;<span title="auto!!length">auto</span>&rsquo; will be affected
-      by a length in the other dimension. That is, <code>@viewport { width: 100%;
-      height: 500px }</code> will resolve width to the window width while
-      <code>@viewport { width: auto; height: 500px }</code> will resolve width
-      from height and the aspect-ratio of the window. A consequence of using
-      percentages instead of device dimensions, is that one cannot use
-      device-height for width or device-width for height.</p>
+      device-height. Above, we translate to 100vw / 100vh which are the window
+      dimensions. The rationale is that the device dimensions would not be what
+      the author intended for UAs where the window is resizable or does not fill
+      the screen of the device.</p>
 
     <div class="example">
       <p>This <code class="html">META</code> element:</p>