CODEWITHSUNDEEP
htmlcssiframe
Ali
Ali

Reputation: 267077

Setting an IFrame's height to 100% doesn't result in it expanding to fill the page?

I'm trying to show an iframe and have it fill the full page. To do this, I'm using: 

<iframe src="http://cnn.com" style="margin-top: 80px;" height="100%" width="100%" ></iframe>

There are no external stylesheets or anything, its simply a barebones html page which is showing this iframe.

However, while this does get the iframe to fill 100% of the with of the page (i.e it expands horizontally to full width), the iframe remains about 300-400px long vertically. Obviously that isn't enough to show the full page, so it gets a vertical scrollbar.

If I set the height to 1000px or 1500px, then it does work, but I would prefer to use percentages, so it would be neither too big, nor too small.

Any ideas?

Upvotes: 0

Views: 217

Answers (1)

gitaarik
gitaarik

Reputation: 46300

Set the height of the html and body tags to 100%:

html, body {
    height: 100%;
}

Upvotes: 2

Related Questions