Add this to the functions.php
/**
* Add Response code to video embeds in WordPress
*
* @refer http://alxmedia.se/code/2013/10/make-wordpress-default-video-embeds-responsive/
*/
function abl1035_alx_embed_html( $html ) {
return '<div class="video-container">' . $html . '</div>';
}
add_filter( 'embed_oembed_html', 'abl1035_alx_embed_html', 10, 3 );
add_filter( 'video_embed_html', 'abl1035_alx_embed_html' ); // Jetpack
Add this to your stylesheet
/*---------- Video Embeds ---------*/
.video-container {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
max-width: 1200px;
margin: 0 auto;
}
.video-container iframe, .video-container object, .video-container embed, .video-container video {
position: absolute;
top: 0;
left: 0;
right: 0;
width: 100%;
height: 100%;
}
Adjust or remove max-width as needed.