Responsive Youtube Player

Youtube Videos werden meisst als Iframe in eine Website eingebunden. Dies hat jedoch den Nachteil, dass sie sich nicht an die Größe des umgebenden Div's anpassen. Folgender Code schafft da Abhilfe.

<div class="yt">
 <div>
 <iframe frameborder="0" allowfullscreen="" src="https://www.youtube.com/embed/51UEVF_lJ8c"></iframe>
 </div>
</div>

.yt {
 max-width: 1020px;
 margin: 0px auto;
}
.yt > div {
 position: relative;
 padding-bottom: 75%;
 height: 0px;
}
.yt iframe {
 position: absolute;
 top: 0px;
 left: 0px;
 width: 100%;
 height: 100%;
}

Quelle: http://stackoverflow.com/quest…-the-page-but-also-keep-t