title: Images on a website look extremely stretched when viewed from a mobile browser
body: <p>I have <a href="http://www.problemio.com" rel="nofollow">this home page of a website</a> and when viewed on the web, it appears ok, but when I visit that site from my Android phone's browser, the images look very stretched.</p>
  
  <p>Here is how the HTML looks like:</p>
  
  <pre><code>&lt;div style="float: left; width: 255px;"&gt;
          &lt;p&gt;&lt;h3&gt;Marketing&lt;/h3&gt;&lt;/p&gt;
          &lt;div style="float: left; width: 120px;"&gt;
              &lt;p&gt;&lt;a href="https://itunes.apple.com/us/app/marketing-advertising-articles/id587238156?ls=1&amp;mt=8"&gt;
              &lt;img src="http://www.problemio.com/img/app-store-icon.png" style="border: none; height: 99%; width: 99%;" alt="iPhone and iPad Marketing App" /&gt;&lt;/a&gt;&lt;/p&gt;
          &lt;/div&gt;
          &lt;div style="float: left; padding-left: 10px; width: 120px;"&gt;
              &lt;p&gt;&lt;a href="https://play.google.com/store/apps/details?id=com.marketingpremium"&gt;
              &lt;img src="http://problemio.com/img/google-play-icon.png" style="border: none; height: 99%; width: 99%;" alt="Android Marketing App"  /&gt;&lt;/a&gt;&lt;/p&gt;
          &lt;/div&gt;
          &lt;div style="clear:both;"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And the two images appear very stretched when viewing in an Android browser. Would anyone know how to stop that from happening or what is the root cause?</p>