Automatic responsive iframes with JS + CSS.

responsive-iframes.css

/* CSS code */
.responsive-iframe {
    position: relative;
    padding-bottom: 0; // Will be overriden by Javascript
    height: 0;
    overflow: hidden;
    margin-bottom: 20px;
}

.responsive-iframe iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

responsive-iframes.js

// jQuery code
$('iframe').each(function()
{
    var w = $(this).width(),
        h = $(this).height(),
        ratio = h/w*100;

    $(this)
        .wrap('<div class="responsive-iframe">')
        .parent()
        .css('padding-bottom',ratio+'%');
});