Home/ Questions/Q 8678373
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-12T20:42:12+00:00

I’ve got an application where an image needs to be stretched to fill the

  • 0

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.

The entire src for the page looks like this (don’t worry it’s small ;))

<html lang="en">
<head>
    <meta charset="utf-8">
        <meta content="width=device-width, initial-scale=1.0" name="viewport">
        <link href="/assets/a4727ffb/css/bootstrap.css" type="text/css" rel="stylesheet">
        <link href="/assets/a4727ffb/css/bootstrap-responsive.css" type="text/css" rel="stylesheet">
        <link href="/assets/a4727ffb/css/bootstrap-yii.css" type="text/css" rel="stylesheet">
        <script src="/assets/44b05ae/jquery.js" type="text/javascript"></script>
        <script src="/assets/a4727ffb/js/bootstrap.js" type="text/javascript"></script>
</head>
<body>
<style>
    .container-fluid {
          padding: 0px;
    }
</style>

<div class="container-fluid">
    <div class="row-fluid">
            <img alt="camera" src="/index.php/camera/getLatestImage/28?0.660698722382962" style="width:100%;height:100%">
    </div>
</div>
</body>
</html>

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.

Any help would be greatly appreciated,

Alan

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    After Daniels response I figured out a way, thanks Daniel.

    <html lang="en">
<head>
        <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/> 
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <link href="/assets/a4727ffb/css/bootstrap.css" type="text/css" rel="stylesheet">
        <link href="/assets/a4727ffb/css/bootstrap-responsive.css" type="text/css" rel="stylesheet">
        <link href="/assets/a4727ffb/css/bootstrap-yii.css" type="text/css" rel="stylesheet">
        <script src="/assets/44b05ae/jquery.js" type="text/javascript"></script>
        <script src="/assets/a4727ffb/js/bootstrap.js" type="text/javascript"></script>
    <style>
        html, body {background:none;height:100%; margin:0; padding:0;}
        .camera-holder {position:fixed; top:0; left:0; width:100%; height:100%;z-index:-1;}
        </style>
        </head>
        <body>
        <style>
            .container-fluid {
                  padding: 0px;
            }
        </style>
        <div class="container-fluid">
            <div class="row-fluid">
        <div class="camera-holder">
                    <img alt="camera" src="/index.php/camera/getLatestImage/28?0.660698722382962" style="width:100%;height:100%">
        </div>
            </div>
        </div>
    </body>
</html>
    • 0