I would always prefer to avoid using an iframe, but sometimes it is the easy / only way out of a technical mess. If the required height for the iframe is unknown / not fixed then you might have a too small of a window for it (with scrollbars) or too much empty space below it.
The answer is simple – adjust the height with JavaScript after the content is loaded:
|
1 |
<iframe src="content.php" scrolling="no" onload="this.style.height = 0;this.style.height=this.contentDocument.body.scrollHeight +'px';" style="border:none;width:100%;outline:none;overflow:hidden;"></iframe> |
There are occasions in which the above will not work 100%, like content delivered from another domain, interactive content which changes its height etc. There are other solutions and even libraries that handle it, but for basic use this code delivers.