Make YouTube Embeds Responsive in WordPress [code snippet]


The CSS styles below will make any YouTube video embeds using just the URL responsive. Add this to the bottom of your WordPress theme CSS stylesheet.

.embed-youtube{ position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } 
.embed-youtube iframe, .embed-youtube object, .embed-youtube embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

 



Written by: Jake Lett
Jake Lett is a B2B marketing consultant with over 15 years of experience in the digital marketing industry. He specializes in SEO, HubSpot, and PPC campaign management. Jake has a proven track record of helping businesses increase their online visibility and drive more traffic, leads and sales. He is a Certified Google Ads Specialist and a Certified HubSpot Developer.

Related posts

Tags:

Want to Get Email Updates of New Articles?

Join My Email Newsletter