How can I make the iframe fill the whole page? I would like my page to behave just like the target page. If I use this CSS:
body { margin: 0; padding: 0; overflow: hidden; } iframe { height: 100%; width: 100%; border: none; overflow: hidden; }
And this HTML:
<body> <iframe src="https://en.wikipedia.org/wiki/IPhone"></iframe> </body>
Then the iframe only covers the top part of the page, despite the height set to 100%. How can I fix this?
You probably also been to make the body 100% of the height: it doesn’t stretch by default: body { height: 100vh; }
You can set styles to
body{margin:0} iframe { width: 100%; height: 100vh; }
Codepen Demo
Other work around can be Responsive Iframes