Responsive Iframe – Responsive Video

Lascio qui anche per uso personale un paio di stili che sono utili per rendere responsive gli iframe e i video.
Sono CSS molto semplici, ma veramente ti tirano fuori dai guai in caso di Responsive Fluid.
Questi stili ti permettono di integrare un video senza quelle fastidiosissime bande nere che possono vedersi lateralmente o sopra e sotto al video.
In realtà questo stile è l’ideale per rendere fluido qualsiasi iframe, anche una mappa di Google.
Lascio qui sotto un video per fare subito una prova in tempo reale.
Il video è stato realizzato da me con veramente pochissimi mezzi, quindi abbiate pietà :)

<style>
.classe-contenitore-iframe { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } 
.classe-contenitore-iframe iframe, .classe-contenitore-iframe object, .classe-contenitore-iframe embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
</style>
<div class='embed-container'><iframe src='https://www.youtube.com/embed/HMSI0EV980k' frameborder='0' allowfullscreen></iframe></div>

Per problematiche relative alla responsività del tuo sito contattami usando questo modulo.