How to manipulate the iframe css based on device size

Question

I\'m building this site and I\'m having trouble manipulating the iframe based on size of the device. Basically, what I want is if the use is on a tablet the video is one size bu

Answer 1

Try this:

.embed-container {
   position: relative;
   width: 100%;
   height: 0;
   padding-bottom: 56.27198%;
 background-size: cover;
 background-repeat: no-repeat;
   background-position: center center;
 }

.embed-container iframe {
 position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%
 }

more detail