Tengo la maquetacion de la pagina hecha con divisiones pero no acaba de funcionar.A la hora de ir haciendo mas pequeña la ventana del navegador,la pagina se va adaptando bien hasta cierto punto en el que empieza a descolocarse todo y se desmonta la maquetacion.
Aqui dejo el codigo de la maquetacion y el ccs,a ver si me pueden ayudar porque mas que miro y miro no le veo el fallo ni la solucion al problema
<html>
<head>
<LINK REL="stylesheet" HREF="estilos.css" TYPE="text/css">
</head>
<body>
<div align="center" id="principal2">
<div id="encabezamiento">
<div align="center" id="encabezamiento1">
</div>
<div align="left" id="encabezamiento2">
</div>
</div>
<div id="navlocal">
</div>
<div id="contenido2">
<div align="left" id="contenido">
</div>
<div align="left" id="navegacion">
</div>
</div>
</div>
</body>
</html>
//Codigo CSS
#encabezamiento { position:relative;width:100%;height:10%;}
#encabezamiento1 { position:relative;width:40%;height:100%;float:left ;background-color:#6699FF;}
#encabezamiento2 { position:relative;width:40%;height:100%;background-color:#FFFFFF}
#contenido2 { position:relative;width:100%;height:85%;}
#navegacion{ position:relative;width:20%;height:100%;float:left ;background-color:#8C0000}
#contenido { position:relative;width:80%;height:100%;float:righ t;background-image:url(fondo3copia.jpg);background-position:center bottom;margin: 0;padding:0;}
#navlocal{
position:relative;
width:100%;height:5%;background-color:#990000}
#principal2{position:absolute;width:100%;height:10 0%;}