Make your YouTube embed field responsive

I use the media module on this site to embed videos from my YouTube channel but the rendered videos were not responsive. I was lazy for over a year but today I thought of fixing it. Quick search on google and I found this link.

  1. .field--name-field-media-oembed-video{
  2.   position: relative;
  3. }
  5. .field--name-field-media-oembed-video:after {
  6.   content: '';
  7.   display: block;
  8.   padding-bottom: 56.25%;
  9. }
  11. .field--name-field-media-oembed-video iframe {
  12.   position: absolute;
  13.   top: 0;
  14.   right: 0;
  15.   bottom: 0;
  16.   left: 0;
  17.   width: 100%;
  18.   height: 100%;
  19.   margin: 0;
  20. }

Ravi Sagar Newsletter

Want to contact me?

Life begins outside your comfort zone and that is where your courage is developed". Write to me by filling this form. For living I am an Atlassian Consultant who love both Jira and Drupal. I am the author of "Mastering JIRA" and "Mastering JIRA 7" books. I Love both JIRA and Drupal (a bit more). You can Write To Me and I will get back to you as soon as I can. Have a nice day!

Social Links