Responsive Iframe

One time I found a WP plug-in that did a responsive iframe that fitted the height. I can’t find it again now, but it shows that it’s possible. I used it to embed faucetinabox into a WP page and it worked, looked like part of the site, no scrollbars etc. [edit: Found it again – auto iframe, but looks like it has been abandoned.] [edit: now (july 2020) upated again]

In the end, I have used <iframe src="" style="position: absolute; top:0; left: 0; width: 100%; height: 200%;"></iframe> because I still can’t find the way to just make it fit the height. I tried putting it in a position:relative; div but that produced a narrow div instead of using full page width – maybe a WP strangeness.

This worked for bittube videos:

<div class="resp-container">
    <iframe class="resp-iframe" src="" gesture="media"  allow="encrypted-media" allowfullscreen></iframe>


<style type="text/css"> 
.resp-container {
    position: relative;
    overflow: hidden;
    padding-top: 56.25%;
.resp-iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;