How to change IFrame height to 100% of its content?

Question

I tried to make an IFrame height to 100% (like a <div> to height:auto).

I set the height attribute in <iframe> tag to 100% and set height in style to 100% too, but it doesn't seem to be working.

Then, I tried to use JavaScript and JQuery to get the height of <iframe> contents, but because of browser security reasons, it didn't got the height of content

How can I solve this? I spent all day to solve this problem.

@IshanMahajan `$("#IframeId").load(function() { $(this).height( $(this).contents().find("body").height() ); });` **Error: Permission denied to access property "document"** — Mike, Apr 16 '17 at 14:29
[This question will solve your problem for the error](http://stackoverflow.com/questions/36333978/error-permission-denied-to-access-property-document) — Black Mamba, Apr 16 '17 at 14:37

score 0 · Answer 1 · edited May 23 '17 at 12:09

0

The iFrame attribute does not support percent in HTML5. It only supports pixels. So your problem is solved using pixel value.

How do you give iframe 100% height

http://www.w3schools.com/tags/att_iframe_height.asp

edited May 23 '17 at 12:09

Community

1
1

answered Apr 16 '17 at 14:58

Black Mamba

13,632
6
82
105

How to change IFrame height to 100% of its content?

1 Answers1