Simulate a high resolution screen

Hi E's,
I try to do a simulator/emulator for test my pages in different devices.
The problem is when the resolution is higher then the screen that show the simulate, that broke the width of the screen.
For try resolve the problem I use this two codes:
<!DOCTYPE html>
  <html>
    <head>
<meta charset="UTF-8">
      <!--Import Google Icon Font-->
      <link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
      <!--Import materialize.css-->
      <link rel="stylesheet" href="../../tutoriais/1435/materialize/css/materialize.min.css"/>
 
      <!--Let browser know website is optimized for mobile-->
      <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    </head>
 
    <body>
        
        <div class="row">
            <div class="col s12">
                <iframe style="width:960px; height: 600px;" src="iframe.php" width="1920" height="1200"></iframe>
                </div>
            </div>
        
      <!--Import jQuery before materialize.js-->
      <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
      <script src="../../tutoriais/1435/materialize/js/materialize.min.js"></script>
    </body>
  </html>

Open in new window

<!DOCTYPE html>
  <html>
    <head>
<meta charset="UTF-8">
      <!--Import Google Icon Font-->
      <link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
      <!--Import materialize.css-->
      <link rel="stylesheet" href="../../tutoriais/1435/materialize/css/materialize.min.css"/>
 
      <!--Let browser know website is optimized for mobile-->
      <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    </head>
 
    <body>

<div class="row">
<div class="col s2 m10 l10 xl5">
<img src="ponte.jpg" class="responsive-img">
</div>
</div>

      <!--Import jQuery before materialize.js-->
      <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
      <script src="../../tutoriais/1435/materialize/js/materialize.min.js"></script>
    </body>
  </html>

Open in new window

The first code is where I call the iframe, and the second is the iframe content.
I try to use CSS to reduce the size of the box, but not resolve the problem.

The question is, have any trick, for show high resolution screen in my simulator without broke the width?

The best regards, JC
LVL 3
Pedro ChagasWebmasterAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Miguel OzSoftware EngineerCommented:
You should not have the need to write a simulator, browsers like Google chrome have this  feature as part of their dev tools.
0
Pedro ChagasWebmasterAuthor Commented:
Hello,
Have lots of tools to do that, including Google Chrome.
But what I want to do is a simulator, because that I come to ask for help in Expert's Exchange.
Maybe what I want not was possible?!

~JC
0
Miguel OzSoftware EngineerCommented:
IT is possible, but I can not justify time spent on it.
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

Pedro ChagasWebmasterAuthor Commented:
I understand that.
I try to understand better the page viewport, maybe the solution begins with viewport.
Give me just a idea where I can start?!

~JC
0
Pedro ChagasWebmasterAuthor Commented:
Yes, the most easy way is change the viewport, maybe have another solutions, but viewport change was a good solution.

~JC
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Pedro ChagasWebmasterAuthor Commented:
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Web Development

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.