Cuando añades un Iframe de Youtube en tu página web, puedes cambiar en este mismo iframe el tamaño del video con “width” y “height”. Pero, ¿Cómo ajustamos el tamaño en dispositivos móviles o tablets?

Para mostrar correctamente un iframe, siempre tienes que encerrarlo en un DIV para poder darle una clase y conseguir el modo Responsive. Aquí puedes ver un ejemplo:

.contenedor-video {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
}
.contenedor-video iframe {
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
	display:block;
}

Ahora sí se ajusta al tamaño del dispositivo desde donde estemos viendo el vídeo.