Foros del Web » Creando para Internet » CSS »

Como hacer que un iframe ocupe el 100% de un div?

Estas en el tema de Como hacer que un iframe ocupe el 100% de un div? en el foro de CSS en Foros del Web. Hola, Estoy intentando lograr que un iframe ocupe el 100% de un div. Aclaro que uso el iframe debido a que no puedo cargar con ...
  #1 (permalink)  
Antiguo 30/06/2009, 12:17
Avatar de marcosr  
Fecha de Ingreso: agosto-2005
Ubicación: Montevideo, Uruguay
Mensajes: 451
Antigüedad: 12 años, 3 meses
Puntos: 5
Como hacer que un iframe ocupe el 100% de un div?

Hola,


Estoy intentando lograr que un iframe ocupe el 100% de un div.
Aclaro que uso el iframe debido a que no puedo cargar con AJAX el mismo contenido.


Tengo un div que se llama "contenido" que tiene ancho 80% de la pantalla y alto 100%, necesito que dentro de ese div se muestre un iframe que ocupe el 100% del div, no puedo lograrlo.

Ya le he definido al iframe height y width 100%, tanto en las propiedades del iframe como en el estilo del mismo (CSS).

He aquí el problema:





Espero alguien pueda ayudarme.
__________________
Yo hago preguntas inteligentes para obtener respuestas rapidas, y vos?
(únete a la campaña !)
  #2 (permalink)  
Antiguo 30/06/2009, 12:56
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Respuesta: Como hacer que un iframe ocupe el 100% de un div?

podriamos ver todo tu código HTML y CSS?
  #3 (permalink)  
Antiguo 30/06/2009, 14:32
Avatar de marcosr  
Fecha de Ingreso: agosto-2005
Ubicación: Montevideo, Uruguay
Mensajes: 451
Antigüedad: 12 años, 3 meses
Puntos: 5
Respuesta: Como hacer que un iframe ocupe el 100% de un div?

Por supuesto.


Este es el iframe:
Código:
<div id="vista">
    	<div class="cabezal">Contenido</div>
        <div class="contenido" id="pp">
<iframe frameborder="0" height="100%" width="100%" src="<?php echo $archivo; ?>" style="float:left; height:100%; width:100%;"></iframe>
</div>
    </div>
El CSS es este:
Código:
#vista {
	float:left;
	width:79%;
	height:100%;
	margin:0 1% 0 0;
}
.contenido {
	width:100%;
	min-height:400px;
	font-family:Tahoma, Geneva, sans-serif;
	font-size:0.7em;
	padding:7px 0 3px 5px;
	border:1px solid #002F5F;
	border-top:none;
	color:#333;
	background:white;
}
#contenido {
	float:left;
	width:100%;
	height:100%;
}
#pp { height:100%; }
__________________
Yo hago preguntas inteligentes para obtener respuestas rapidas, y vos?
(únete a la campaña !)
  #4 (permalink)  
Antiguo 30/06/2009, 18:17
 
Fecha de Ingreso: octubre-2004
Mensajes: 289
Antigüedad: 13 años, 2 meses
Puntos: 10
Respuesta: Como hacer que un iframe ocupe el 100% de un div?

Hola marcosr

Sólo tienes que añadir esto a tu css, en primer lugar:

html, body {
height: 100%;
}


Saludos
  #5 (permalink)  
Antiguo 30/06/2009, 21:15
Avatar de marcosr  
Fecha de Ingreso: agosto-2005
Ubicación: Montevideo, Uruguay
Mensajes: 451
Antigüedad: 12 años, 3 meses
Puntos: 5
Respuesta: Como hacer que un iframe ocupe el 100% de un div?

@ssclamp:
Muchas gracias, tu solución funciono perfectamente.



Un abrazo !
__________________
Yo hago preguntas inteligentes para obtener respuestas rapidas, y vos?
(únete a la campaña !)
  #6 (permalink)  
Antiguo 30/06/2009, 21:38
 
Fecha de Ingreso: octubre-2004
Mensajes: 289
Antigüedad: 13 años, 2 meses
Puntos: 10
Respuesta: Como hacer que un iframe ocupe el 100% de un div?

De nada marcosr.

Resulta curioso pensar que una página web, su contenedor primario (la etiqueta html), necesita tener expresada sus medidas para algunas cosas: da la impresión, visualmente hablando, que una página web (aunque esté vacía de contenido, o con poco contenido) es como un folio, que existe por sí mismo y cuyo espacio puede ser ocupado sin más, sin embargo, en ocasiones, es imprescindible decirle a la etiqueta html que tiene un tamaño para que pueda ser ocupado.

En el modo más permisivo, sin doctype, los navegadores sí entienden que el espacio html es todo el que ocupe en la pantalla, sin necesidad de fijarle ningún valor... es otra curiosidad más.

Saludos
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 03:41.