This post tests YouTube video embeds.
Simply use the responsive-embed
helper include like so:
{% include responsive-embed url="https://www.youtube.com/watch?v=-PVofD2A9t8" ratio="16:9" %}
Or wrap embeds with a <div>
element and the appropriate classes:
<!-- 21:9 aspect ratio -->
<div class="responsive-embed responsive-embed-21by9">
<iframe class="responsive-embed-item" src="..."></iframe>
</div>
<!-- 16:9 aspect ratio -->
<div class="responsive-embed responsive-embed-16by9">
<iframe class="responsive-embed-item" src="..."></iframe>
</div>
<!-- 4:3 aspect ratio -->
<div class="responsive-embed responsive-embed-4by3">
<iframe class="responsive-embed-item" src="..."></iframe>
</div>
<!-- 1:1 aspect ratio -->
<div class="responsive-embed responsive-embed-1by1">
<iframe class="responsive-embed-item" src="..."></iframe>
</div>