Embed YouTube videos responsively
🌱 This post is in the growth phase. It may still be useful as it grows up.
YouTube makes it easy to copy-paste a video embed. LOVE THAT!
But, the default embed isn’t responsive so it is guaranteed to look shit wherever you embed it.
I’ve dragged this snippet around the internet with me for years.
- Copy a YouTube embed from the share sheet.
- Paste that embed in an HTML or markdown file.
- Wrap it in a block-element container with the
- Enjoy container-aware responsive videos!
It’ll look like this:
This works with layouts as well. Around chan.dev, you’ll see this paired with a flex and grid layout.
If you know where I originally swiped this from, let me know so I can give the author credit here.
@chantastic on twitter and discord.