title: iPad Safari: device width is device-height?
body: <p>Take a look at the code below. To have the web page fill the horizontal space, I specify in the <code>viewport</code> meta tag: <code>width=device-height</code></p>
  
  <p>In landscape orientation <code>device-height</code> evaluates to 1024px, and in portrait orientation it evaluates to 768px!</p>
  
  <p>I am puzzled: Why is the <em>width of the device</em> stored in <code>device-height</code>? Is this the case for all iOS devices?</p>
  
  <pre><code>&lt;!doctype html&gt;
  
  &lt;html&gt;
    &lt;head&gt;
      &lt;title&gt;Fit to Width Test&lt;/title&gt;
      &lt;meta name="viewport" content="user-scalable=no, width=device-height"&gt;
    &lt;/head&gt;
  
    &lt;body style="margin: 0; width: 1024px"&gt;
      &lt;div style="width: 1022px; border: 1px solid red"&gt;
        1024px wide
      &lt;/div&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>