Publicado em 5 de ago.

Expansão de vídeo por CSS

#css #video #perguntas-e-respostas-rapidas

Como eu poderia tirar essas bordas pretas do vídeo com CSS? Está configurado com width 100%, o que no desktop deixa a visualização perfeita mas em mobile fica com essas bordas pretas superiores e inferiores.

Discussão (1)

Entre ou cadastre-se para participar da discussão

Entrar Criar conta

Omar~· 6 de ago.

Tente assim eu uso para colocar vídeos do youtub e ainda ficarem responsivos:

<div class="video">
 <iframe
 src="https://www.youtube.com/watch?v=BsV7hfJAlVc"
 frameborder="0"
 allowfullscreen>
 </iframe>
</div>

	CSS:

.video {
 position: relative;
 padding-bottom: 56.25%;
 height: 0
}

.video iframe {

 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%
}