Hola!
Necesito ayuda con los CSS de una capa en concreto que he llamado "ZonaEditable", dentro tengo un IFRAME que carga una web de ejemplo, pero por mucho que le pongo la altura al 100% no me muestra toda la web que carga el IFRAME solo un trozo.
La estructura es la siguiente, tengo una capa principal ESCRITORIO y dentro tengo 3 capas:
1) Encabezado
2) ZonaEditable
3) PieDePagina
Todas cargan IFRAME pero me gustaria que la capa ZonaEditable se adaptara al tamaño de la web que carga el IFRAME que contiene.
He mirado varios scripts por internet pero hasta ahora no he conseguido que me funcione ninguno.
Espero haberme explicado medianamente bien para captar la idea de lo que quiero conseguir.
Agradecería cualquier ayuda o sugerencia. Muchas Gracias, Salu2!
-------------------- codigo ------------------------------------------------
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title></title>
<style type="text/css">
<!--
html,body,td,th {
font-family: Trebuchet MS, Verdana, Arial, sans-serif;
height:100%;
}
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
#Escritorio {
position:absolute;
width:100%;
min-height:100%;
z-index:2;
background-color: #000000;
top: 0px;
overflow: automatico;
text-align:center;
}
#Encabezado {
position:absolute;
width:100%;
height:111px;
z-index:6;
background-color: #CCCCCC;
left: 0px;
top: 0px;
}
#PieDePagina {
position:absolute;
width:100%;
height:110px;
z-index:5;
background-color: #CCCCCC;
left: 0px;
bottom: -111px;
}
#ZonaEditable {
position:absolute;
width:100%;
height:100%;
z-index:4;
background-color: #CCCCCC;
left: 0px;
top: 111px;
bottom: -112px;
}
</style>
</head>
<body>
<div id="Escritorio">
<div id="ZonaEditable">
<iframe id="Centro" src="http://www.yahoo.es/" width="970" height="100%" frameborder=0 scrolling="no"> </iframe>
</div>
<div id="PieDePagina">
<iframe src="pie.php" width="970" height="100" frameborder=0 scrolling="no"></iframe>
</div>
<div id="Encabezado">
<iframe src="encabezado.php" width="970" height="110" frameborder=0 scrolling="no"></iframe>
</div>
</div>
</body>
</html>
----------------------------------------------------------------------------------------