1

Is there a way to set an iFrame element to the size of elements inside it, discluding margins?

For example, if I set an iFrame of https://example.com, it will show

<iframe src="https://example.com"></iframe>

and I can change the height and width with CSS or JS but can I automatically set the width and height of an iFrame so that there is no scroll?

I tried doing something like

onload='this.style.height=this.contentWindow.document.body.scrollHeight+"px";this.style.width=this.contentWindow.document.body.scrollWidth+"px";'

but it did not work.

Any help would be deeply appreciated.

Timothy Chen
  • 431
  • 3
  • 8
  • how do you "define" content width if the content is set to floating? this question alone should tell you it's unrealistic to approach it this way. – GottZ Jan 04 '21 at 05:21
  • Sorry, I would just take everything off except what is inside the padding. – Timothy Chen Jan 04 '21 at 05:25
  • https://stackoverflow.com/questions/819416/adjust-width-and-height-of-iframe-to-fit-with-content-in-it – epascarello Jan 04 '21 at 15:27

1 Answers1

0

I think it's not possible when the iframe is from a different domain. To set the iframe size according to its content, you need to access this content and "measure" it, using Javascript. In most of the cases, you'll encounter a cross origin request security error that will prevent you from accessing the content.

But maybe you want to achieve this with an iframe from the same domain and provided "example.com" as an... example ?

dvd
  • 179
  • 3
  • 11