Responsive Videos

Auf der Suche nach einer Lösung, Videos responsive einzubinden, bin ich auf die folgende CSS only Lösung gestoßen. Lediglich die Breiten- und Höhenangaben müssen entfernt werden.

.embed {
    position: relative;
    overflow: hidden;
    height: 0;
    padding-bottom: 56.25%; /* 16/9 ratio */
    padding-top: 30px; /* IE6 workaround*/
    
    iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
}

Quelle: http://www.andmag.se/2011/11/responsive-embeds

Übersicht