Desplazamiento de Divs

mcamposs · #1 (**permalink**) 17/04/2012, 22:36

Hola amigos, quiero una ayuda con lo siguiente:
Tengo div contenedor, dentro de él hay 3 div fijo. Cuando modifico el tamaño de la página del navegador, los Divs se empiezan a mover abajo a medida que hago la pantalla mas pequeña. Cómo hago para que los divs estén siempre en sus lugares y se ponga en el navegador la barra de desplazamiento en la parte de abajo?

#contenedor {width:1024px; overflow: hidden;}
#left-sidebar { width:256px; height:500px; float: left; background-color:ff0000; }
#content {width:512px; height:500px; float: left; background-color:f0f0f0; }
#right-sidebar { width:256px; height:500px; float: right; background-color: ABC012; }

Agradecería muchísimo una ayuda en este sentido.

C2am · #2 (**permalink**) 17/04/2012, 22:53

Hola, muestra el html donde aplicas esos estilos.
En principio con lo que muestras no debería moverse.
Saludos

mcamposs · #3 (**permalink**) 17/04/2012, 23:48

Index.html
<html>
<head>
<title>SELECCION DE MODULOS</title>
<link href="style.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<div id="wrapper">
<div id="logo">
LOGO
</div> 
<div id="menuprincipal">
MENU PRINCIPAL
</div> 
<div id="marco-general"> 
<div id="left-sidebar">
LEFT SIDEBAR
</div> 
<div id="content">
CONTENT
</div> 
<div id="right-sidebar">
RIGHT SIDEBAR
</div> 
</div> 
<div>
<div id="footer">
FOOTER
</div> 
</div> 
</body>
</html>
--------------------
El CSS completo es:
#body {background-color:D5D5D5;}
#wrapper {width:100%px; overflow: hidden; margin:0 auto; }
#wrapper {border-color: #aaaaaa; border-width: 1px; border-style: solid;}
#logo {width:100%px; padding:2px 0px 2px 10px;}
#menuprincipal {width:100%; height:30px; background-color:00ff00;}
#marco-general {width:100%px; overflow: hidden;}
#left-sidebar { min-width:256px; max-width:512px; height:500px; float: left; background-color:ff0000; }
#content {min-width:800px; max-width:1024px; height:500px; float: left; background-color:f0f0f0; }
#right-sidebar { min-width:256px; height:500px; float: right; background-color: ABC012; }
#footer {width:100%; height:50px; background-color:D5D5D5; clear:both;}
--------------------
No es grande, apenas estoy empezando esta web y conociendo los divs.

Gracias por tu ayuda de antemano.

Yo uso Mozilla.

C2am · #4 (**permalink**) 18/04/2012, 09:39

Código CSS:

Ver original#marco-general {width:100%px; overflow: hidden;}

Lo anterior es "%" o "px", no ambos.
Y para que no se mueva deberia ser un ancho fijo, en px según definiste en el primer post, aunque la medida no debería ser de 1024px porque también debes tener en cuenta los bordes, los padding y los margin. En general dicho ancho se fija en unos 960 o 970px aproximadamente.

Saludos