title: Why are my images too big for iPhone
body: <p>I started a Photoshop document with the following set up:</p>
  
  <p>width: 640px<br>
  height: 960px<br>
  Resolution: 326 pixels/inch<br>
  The images are taken directly from that file.</p>
  
  <p>I am using phonegap to build an application. Whenever I test it, it makes my image far too large for the iphone screen. I'm not using a viewport or resizing anything. Please help!</p>
  
  <p>Some of you were asking for my code:</p>
  
  <pre><code>    &lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
    &lt;title&gt;&lt;/title&gt;
  
      &lt;meta charset="utf-8"&gt;
      &lt;link rel="stylesheet" href="iphone.css" type="text/css" /&gt;     
  
  
      &lt;!-- iPad/iPhone specific css below, add after your main css &gt;
      &lt;link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="iphone.css" type="text/css" /&gt;
      &lt;link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="ipad.css" type="text/css" /&gt;        
      --&gt;
      &lt;!-- If your application is targeting iOS BEFORE 4.0 you MUST put json2.js from http://www.JSON.org/json2.js into your www directory and include it here --&gt;
      &lt;script type="text/javascript" charset="utf-8" src="phonegap-1.3.0.js"&gt;&lt;/script&gt;
      &lt;/script&gt;
    &lt;/head&gt;
    &lt;body onload="onBodyLoad()"&gt;
  
  &lt;div class="wrapper"&gt;
  
  &lt;img src="img/iPhone/Welcome.png" class="header" /&gt;
  
  &lt;/div&gt;
  
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>