Make an iframe height automatically extend to the bottom of the browser window?

Question

I'm making a website (codersdomain.site88.net) and I have an iframe that needs to extend to the bottom of my browser window. Here's my html:

<!DOCTYPE html>
<head>
<link rel="icon" 
      type="image/png" 
      href="./icon.png">
</head>
<title>Coder's Domain</title>
<body style="overflow-x:hidden; overflow-y:hidden; height:100%;"
 background="BG.jpg">
<div align="center">

<iframe tabindex="-1" style="height:590px; width: 596px; overflow-y:'scroll' overflow-x:'hidden' " src="index_data.html"frameborder=0 ></iframe>
</div>

</body>

can somebody tell me how I might make the height automatically extend to the bottom of the window?

body { overflow-x:hidden; overflow-y:hidden; height:100%; }
iframe {height:590px; width: 596px; overflow-y:'scroll' overflow-x:'hidden'}

    <body
     background="BG.jpg">
    <div align="center">
    
    <iframe tabindex="-1" src="index_data.html" frameborder=0 ></iframe>
    </div>
    
    </body>

Edit your question and look at the button bar. Visit [help] and take the [tour] — mplungjan, May 12 '16 at 17:29
See the snippet I made for you. I moved the inline style to the CSS stylesheet — mplungjan, May 12 '16 at 17:44
um i actually just deleted it like a stupid XD could you do it again :- | — HungryBoy02, May 12 '16 at 17:46
how would i make it into an html file, or what file would it be? — HungryBoy02, May 12 '16 at 17:49
To use a CSS file, include it `` and put the stuff in it I put in the CSS frame in the snippet. That does not solve your issue, but makes it MUCH easier to inspect and modify — mplungjan, May 12 '16 at 17:52
well i just realized i could set the height to 100% and yeah i feel pretty dumb... `-` — HungryBoy02, May 12 '16 at 17:54
Possible duplicate of [How do you give iframe 100% height](http://stackoverflow.com/questions/5272519/how-do-you-give-iframe-100-height) — mplungjan, May 12 '16 at 18:00

score 3 · Accepted Answer · answered May 12 '16 at 17:58

3

Just change the height to 100%

 <iframe tabindex="-1" style="height:100%;
 width: 596px; overflow-y:'scroll' 
 overflow-x:'hidden' " src="index_data.html"frameborder=0>

</iframe>
</div>

answered May 12 '16 at 17:58

Shubham Chahal

774
1
5
7

Make an iframe height automatically extend to the bottom of the browser window?

1 Answers1