Ver Mensaje Individual
  #2 (permalink)  
Antiguo 09/05/2016, 04:30
w3w3b
 
Fecha de Ingreso: abril-2016
Ubicación: Valencia
Mensajes: 17
Antigüedad: 8 años
Puntos: 1
Respuesta: ¿Cómo hacer responsive un video iframe con contenedor?

A que te refieres con hacer responsive el video? Que se vea siempre al 100%. Si quieres usar diferentes tamaños fijos para el video, como estas haciendo ahora. Lo ideal sería utilizar las media querys de css3 para que adapte el tamaño del video al tamaño del dispositivo en el que lo estas viendo.
Si lo que quieres es que el video siempre ocupe un tanto por 100 de la página haz que el widht:80%. Por ejemplo. Aunque sería bueno usar media querys para cualquier de las dos opciones.

Cita:
Iniciado por manu_abella Ver Mensaje
Buenos días, alguien podria ayudarme a que esto sea responsive?

Código HTML:
<div class="contenedor">
<style type="text/css">.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
</style>
<div class="embed-container"><iframe allowfullscreen="" frameborder="0" height="480" src="https://www.youtube.com/embed/1P9C3XWJrAk?rel=0" width="853"></iframe></div>
</div>
<style type="text/css">.contenedor {
		margin:auto;
		width:853px;
		height:572px;
		text-align:center;
		background:url('imagenes/tv.png')
	}
	.contenedor iframe {
		width:828px;
		height:468px;
		top:12px;
		position:relative;
	}
</style>