CODEWITHSUNDEEP
htmlcssresponsive-design
Mr-Kimbles
Mr-Kimbles

Reputation: 83

How to set Zoom % for Certain Browers in HTML?

In web design, is it possible to automatically set a Zoom % for users based on their web browser?

For instance, a website opened in Opera with 100% Zoom may not look the same if it was opened in Chrome at the same 100% Zoom. However, the website at 100% Opera scales identically with Chrome at 125% Zoom. Is there a way to set Zoom views? Am I being confused with view-port?

Upvotes: 1

Views: 8643

Answers (2)

Justin McKee
Justin McKee

Reputation: 156

Viewport is a way of defining the viewable area (I guess it looks a bit like zooming). But it's a meta tag.

<meta name="viewport" content="width=device-width" />

There is another solution in css (check support or vendor prefixes)

@viewport {
    width: 980px;
    min-zoom: 0.25;
    max-zoom: 5;
    orientation: landscape;
}

Upvotes: 1

Robin Carlo Catacutan
Robin Carlo Catacutan

Reputation: 13679

Well it's considered not good, but in rare cases that you want to increase the scale of an element you can do something like this:

   .zoom {
        -ms-transform: scale(1.2);
        -ms-transform-origin: 50% 0; /* IE */
        -moz-transform: scale(1.2);
        -moz-transform-origin: 50% 0 0;  /* Mozilla */ 
        -webkit-transform: scale(1.2);
        -webkit-transform-origin: 50% 0 0;  /* Chrome, Safari, Opera */
     }

Upvotes: 1

Related Questions