quinta-feira, 20 de abril de 2017

Colocar Iframe Embed do youtube responsível

Hoje precisei pesquisar para colocar o iframe embed do youtube de forma responsiva.

E encontrei neste site: https://avexdesigns.com/responsive-youtube-embed/, uma forma simples e muito eficaz:

Basta inserir em seu css:

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
}

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

 


E depois colocar o iframe dentro de uma div, chamando a classe video-container criada no css.


<div class="video-container"><iframe .....=""></iframe></div>
Postar um comentário