Ver Mensaje Individual
  #2 (permalink)  
Antiguo 23/11/2008, 20:29
ssclamp
 
Fecha de Ingreso: octubre-2004
Mensajes: 289
Antigüedad: 19 años, 6 meses
Puntos: 10
Respuesta: ayuda con iframe

Con tu plantilla no se como resolverlo porque no la tengo pero este código que te adjunto funciona perfectamente en ie 6+, firefox y opera y mantiene una cabecera fija, un menu lateral izquierdo y derecho fijos y un pie fijo, y los contenidos se cargan en un iframe central.

Todo lo necesario es adaptar los porcentajes a tu conveniencia y añadir los estilos necesarios para completarlo.

Es líquido en ancho y alto y valida. La prueba está montada cargando en contenidos la página de el periódico El País.

Saludos
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" lang="es">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />
<title>Cabecera, menu izquierdo, menu derecho y pie fijos. Contenido en iframe</title>
<style type="text/css">
html, body {
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	overflow: hidden;
	font-family :  Arial, sans-serif;
	font-size: 14px;
}
#cabecera {
	width: 100%;
	height: 10%;
	overflow: hidden;
	background-color: #CCCCCC;
}
#envolvente {
	position: relative;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 90%;
	overflow: hidden;
}
#izquierda {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 16%;
	height: 93%;
	overflow: hidden;
	background-color: #FFFFCC;
}
#derecha {
	position: absolute;
	right: 0px;
	top: 0px;
	width: 16%;
	height: 93%;
	overflow: hidden;
	background-color: #FFFFCC;
}
#pie {
	position: absolute;
	left: 0px;
	bottom: 0px;
	width: 100%;
	height: 7%;
	overflow: hidden;
	background-color: #CCFFFF;
}
#contenido {
	position: absolute;
	left: 16%;
	top: 0px;
	height: 93%;
	width: 68%;
	background-color: #999999;
}
.texto {
	margin: 6px;
}
</style>
</head>

<body>

<div id="cabecera"><span class="texto">Cabecera de página</span></div>
	<div id="envolvente">
		<div id="izquierda"><span class="texto">Menu izquierdo</span></div>
		<div id="contenido">
			<iframe name="contenidos" height="100%" width="100%" frameborder="0" src="http://www.elpais.com"></iframe>
		</div>
		<div id="derecha"><span class="texto">Menu derecho</span></div>
		<div id="pie"><span class="texto">Pie de página</span></div>
	</div>
</body>

</html>