I made a HTML5 Webapp and I want it auto scaled by window size on PC (not mobile). so I add it in css:
@-ms-viewport { width: 1024px; }
@-webkit-viewport { width: 1024px; }
@-moz-viewport { width: 1024px; }
@-o-viewport { width: 1024px; }
@viewport { width: 1024px; }
In IE10(Win8), It OK, if window is resized smaller, everything in html is smaller. the html has scaled down.
but In Chrome v23, if window is resized smaller, everything in html is NOT scaled at all.Chrome v23 didn't support viewport scale?
Go to your website page from your computer, press Ctrl+U, and then find “viewport” (Ctrl+F). If you did not find a viewport meta tag, then you need to add it. Go to this page from your smartphone and see how it looks there in the browser.
Make sure the layer has not been turned off or frozen: In the Layer Properties Manager, make sure the layer that contains the viewport geometry is not turned off or frozen. Go to the layout tab that contains the problem viewport. From the Properties palette, select the Quick Select button on the top right.
Without a viewport meta tag, mobile devices render pages at typical desktop screen widths and then scale the pages down, making them difficult to read.
Generally, meta elements (including viewport) should be placed in the document's <head> . CSS rules should either be added to a CSS stylesheet and referenced with a <link> element or, if you're not using stylesheets for some reason, in a <style> element (also in the document's <head> ).
No, @viewport
is not yet implemented in Chrome. As far as I'm aware, the viewport
meta tag has only ever been implemented in mobile browsers, not desktop ones.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With