I have an issue where a web page I have build using the Google Maps API, which shows me a correct viewport when viewing the page in Responsive Design Mode (same in FirefoxDeveloperEdition, Chrome and Safari), e.g. ~320x568 for an iPhone 5s. However, when I actually view the page on an iPhone 5 I get a viewport of 980x1461, which makes the page impossible to view on a phone.
I'm using window.innerWidth
and ditto height to access the viewport and get it printed on the web page (source of the numbers above).
Any hints on what could be going wrong?
Do you have viewport meta tag in the head of your page? eg
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
...
</head>
<body>
...
</body>
</html>
More info about this meta tag: https://developers.google.com/speed/docs/insights/ConfigureViewport
Good luck!