Duda maquetación divs

panxo_hammett · #1 (**permalink**) 14/04/2012, 20:21

Hola a todos

Tengo el siguiente problema con una página. Quiero dejar cierta estructura para header, footer y todo eso, al parecer marcha bien, pero al momento de relizar un zoom out se puede visualizar el "fin" de la página, en vez de seguir reduciendo como en la mayoría de los sitios.

No sé que propiedad css me hace falta, ¿Pudiera alguien ayudarme?

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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<style type="text/css">


body {
       margin-left: 0px;
       margin-top: 0px;
	   margin-right: 0px;
	   margin-bottom: 0px;
}

#contenedor {
       height: auto;
	   background-color:#840000;
	   margin: 0 auto; 	
	   margin-top:0px;
}

#cabecera {
       background-color:#eee;
       height:120px;
       padding:5px;
}

#datos {
       background-color:#666;
	   margin-top:0px;
	   text-align:right;
	   color:#FFF;
}

#herramientas {
       background-color:#333;
       height:20px;
       padding:5px;
	   color:#FFF;
}

#contenido {
	   background-color:#CCC;
	   float:none;
	   width:960px;
	   height:700px;
	   padding: 0px;
	   margin-top: 0;
	   margin-right: auto;
	   margin-left: auto;
}

#pie {
       background-color: black;
       clear: both;
	   color:#FFF;
	   height:30px;
	   
	   filter:alpha(opacity = 80); 
	   opacity:0.8;
}


</style>
</head>

<body>
<div id="contenedor">
	<div id="cabecera">
    	<div id="datos">Sesión:dadadad</div>
    </div>
    <div id="herramientas">
    <p style="margin-top:2px">Tipo de documento</p></div>
<div id="contenido">Este es el contenido principal</div>
    <div id="pie">Este es el pie de pagina</div>
</div>
</body>
</html>

Desde ya muchas gracias!!!!

zerokilled · #2 (**permalink**) 14/04/2012, 22:01

buenas...
mi comprehensión a lo que mencionas es poca o nula. ¿a que te refieres con el fin de página? ¿te refieres que al reducir el zoom se ve el footer de la página? si es el caso, opino que eso es normal. se debe a dos factores – al menos – por falta de contenido y por la dimensión vertical del navegador. si no tienes mucho contenido, obviamente al hacer zoomout el contenido se va reubicando hacia arriba. por otro lado, si la dimensión vertical es lo suficiente para mostrar todo el contenido, entonces el footer no lo vas a ver exactamente acoplado en la parte inferior del navegador.

no te tengo la respuesta definitiva pero tendrías que ver si con responsive design se puede lograr algo. es decir, que luego de cierto zoomout o si la barra de scroll no se muestra, hacer que el footer se pegue en el área inferior del navegador. te recomendaría, además de buscar información en responsive design, que solicites muevan el tema al foro css. quizás tengas más suerte ahí.

panxo_hammett · #3 (**permalink**) 14/04/2012, 23:24

mira, les adjunto una imagen para que vean de que se trata

[URL=http://imageshack.us/photo/my-images/269/zoommf.jpg/][IMG=http://img269.imageshack.us/img269/4645/zoommf.jpg][/IMG][/URL]

Uploaded with [URL=http://imageshack.us]ImageShack.us[/URL]

cuando haces un zoom out de mas de 70% pasa esto.

De todas formas echaré un vistazo al responsive desing, nunca está de más

y por último.. podría alguien mover el tema al foro correspondiente...
Gracias!

emprear · #4 (**permalink**) 15/04/2012, 14:02

En tanto no posiciones tu pie con bottom: 0; y este fuera de contenido y utilices porcentajes para el height, en algún momento del zoom out, te va a pasar lo mismo, ya sea con el pie, o el contenido

Saludos