iFrame not expand to 100% height

Question

I have this below html. And I would like the iFrame to cover the rest of the screen with 100% on whatever left. I tried \"100%\" and \"*\" in height attribute but not working. W

Answer 1

This CSS will should do the trick for you:

body {
  margin: 0;
  padding: 0;
  overflow-y: hidden;
}

Then set the height of the iframe to 96%. This will stop it from being pushed off the bottom of the page.

The reason you need this is because 100% height on the iframe is calculated as 100% of the available screen height. Since you've got a 35px tall div above the iframe, you end up with an iframe pushed 35px beyond the total screen height.