title: Twitter bootstrap, stretch an image to full screen on mobile
body: <p>I've got an application where an image needs to be stretched to fill the whole screen. I'm using the twitter bootstrap framework and everything works great on the desktop but on my galaxy s3 the image doesn't scale. </p>
  
  <p>The entire src for the page looks like this (don't worry it's small ;))</p>
  
  <pre><code>&lt;html lang="en"&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
          &lt;meta content="width=device-width, initial-scale=1.0" name="viewport"&gt;
          &lt;link href="/assets/a4727ffb/css/bootstrap.css" type="text/css" rel="stylesheet"&gt;
          &lt;link href="/assets/a4727ffb/css/bootstrap-responsive.css" type="text/css" rel="stylesheet"&gt;
          &lt;link href="/assets/a4727ffb/css/bootstrap-yii.css" type="text/css" rel="stylesheet"&gt;
          &lt;script src="/assets/44b05ae/jquery.js" type="text/javascript"&gt;&lt;/script&gt;
          &lt;script src="/assets/a4727ffb/js/bootstrap.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;style&gt;
      .container-fluid {
            padding: 0px;
      }
  &lt;/style&gt;
  
  &lt;div class="container-fluid"&gt;
      &lt;div class="row-fluid"&gt;
              &lt;img alt="camera" src="/index.php/camera/getLatestImage/28?0.660698722382962" style="width:100%;height:100%"&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I can't think of any reason why this wouldn't work? The image is reloaded every second with some javascript which I haven't included in the above code. But I assume that wouldn't be the issue.</p>
  
  <p>Any help would be greatly appreciated,</p>
  
  <p>Alan</p>