I need a solution for auto-adjusting the width
and height
of an iframe
to barely fit its content. The point is that t
If you can live with a fixed aspect ratio and you would like a responsive iframe, this code will be useful to you. It's just CSS rules.
.iframe-container {
overflow: hidden;
/* Calculated from the aspect ration of the content (in case of 16:9 it is 9/16=
0.5625) */
padding-top: 56.25%;
position: relative;
}
.iframe-container iframe {
border: 0;
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
The iframe must have a div as container.
The source code is based on this site and Ben Marshall has a good explanation.