Menu
Is there a solution to allowing nested iframes to not be scaled due to meta viewport settings in the parent HTML.
I have an iframe being loaded on an external mobile site which I can't edit, that site has the following meta viewport settings:
<meta name="viewport" content="width=640, user-scalable=no">
When the site is loaded on a device that has a width of 320 it scales the site by 0.5, but it also scales nested iframes on that site too, is there a way to disable/stop this?
I have something like this, and the nested h1 in the iframe is being scaled by 0.5
<html>
<head>
<title>Parent</title>
<meta name="viewport" content="width=640, user-scalable=no">
</head>
<body>
<h1>Whole page is scaled by 0.5</h1>
<iframe>
<!-- HTML LOADED BY IFRAME -->
<html>
<head>
<title>Nested iFrame</title>
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
</head>
<body>
<h1>Iframe should not be scaled by parents meta viewport?</h1>
</body>
</html>
</iframe>
</body>
</html>
The solution should also work for sites that don't set a fixed width for viewport meta.
756
Is there a solution to allowing nested iframes to not be scaled due to meta viewport settings in the parent HTML.
No. The viewport settings in the top level document apply to the whole viewport.
Framed documents are displayed in that viewport and its settings apply to them.
A meta viewport element in a framed document is ignored.
126
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
