Pues he usado posicionamiento absoluto para todos mis contenedores. Así me aseguro su posición respecto al contenedor padre.
Es que no se me ocurrió otra forma de implementación que usara porcentajes para todos mis contenedores y que se redimensionaran al mismo tiempo que redimensiono mi ventana.
Con este ejemplo de pagina tambien ocurre lo que digo:
pagina.html
Código:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<link type="text/css" href="estilo.css" rel="stylesheet"></link>
</head>
<body>
<div id="titulo"></div>
<div id="datos">
<div id="contenedor1"></div>
<div id="contenedor2"></div>
</div>
</body>
</html>
estilo.css
Código:
#titulo{
position:absolute;
top:0%;
left:0%;
width:100%;
height:10%
}
#datos{
position:absolute;
top:10%;
left:0%
width:100%
height:90;
}
#contenedor1{
top:0%;
left:0%;
width:100%;
height:40%;
}
#contenedor2{
top:40%;
left:0%
width:100%
height:60%
}
Con este tipo de css tengo los contenedores en la posicion que quiero y se redimensionan al cambiar tamaño de ventana. Pero aparece la parte blanca por debajo al hacer scroll con el raton. ¿Alguna idea?
Supon que esta pagina se muestra en una ventana 1000x600 al hacer click en un boton de otra pagina:
onclick= window.open("pagina.html","ventana",1000,600);
Gracias