Hi, i'm using the following responsive theme: http://www.armorthemes.com/demo/gameking/highway-driving/ trying to figure out how to apply the responsive.css rules to the <div id="video-inside"> container and surroundings the same way the .wrap .cf class applies to rest but also making the iframe to autoscale like this example: http://www.smashingmagazine.com/2014/02/27/making-embedded-content-work-in-responsive-design/ <!DOCTYPE html> <html> <style> .video-container iframe { position: absolute; top:0; left: 0; width: 100%; height: 100%; } .video-container { position: relative; padding-bottom: 56.25%; padding-top: 95px; height: 0; overflow: hidden; } </style> <body> <div class="video-container"> <iframe src="http://www.youtube.com/embed/4aQwT3n2c1Q" height="315" width="560" allowfullscreen="" frameborder="0"></iframe> </div> </body> </html> Code (markup): Anyone firm with the myarcadeplugin and how the 'width/height' fields are written into the HTML please help, i'm really stuck with this part. Thanks in advance
i think the inline width and height have the higher precedence so your css styles will be ignored. try to set height and width of your video container as 100% first, then remove the height/width attribute of iframe. and see how it will goes.
So... you're trying to mix a modern layout technique with a tag that technically has no business on any website written after 1997?
Solution actually the example i already posted had been the right answer, perfectly scaling the iframe, though it was hard to find the right template files and removing some javascript.