Ver Mensaje Individual
  #1 (permalink)  
Antiguo 16/01/2013, 22:20
royalz
 
Fecha de Ingreso: enero-2013
Ubicación: Zaragoza
Mensajes: 24
Antigüedad: 11 años, 11 meses
Puntos: 0
2 divs fijos alineados horizontalmente, que no se muevan al redimensionar la ventana

Hola!, llevo un poco un descontrol porque estoy aprendiendo a marchas forzadas, hace un par de mese me hice una web y ahora la estoy modificando para poder integrar mi blog en ella y asi hacerla mas dinamica.

La he rediseñado en photoshop y tengo 2 cajas, 1 al lado de la otra horizontalmente alineadas en el cuerpo.

Tengo el codigo aqui:

<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>test</title>
</head>
<body bgcolor="000000">
<style type="text/css">
body {background-position: center top; background-image: url(img/wall.png);background-repeat:no-repeat;background-attachment:fixed;}
#cabecera {width: 1152px; height: 340px; position: absolute; left:50%; margin-left: -576px;background-image: url(img/header.png);}
#contenido {width: 70%; height: 70%; position: absolute; left: 50%; margin-left: -35%; top: 345px;}
#menubar {position: relative;background-image: url(img/bar_menu.png); width: 1020px; height: 70px; left: 50%; margin-left: -510px;}
#portada {float: left; position: relative; background-image: url(img/box_portada.png); width: 762px; height: 355px; left: 50%; margin-left: -580px;}
#destacado {float: right; position: relative; background-image: url(img/box_destacado.png); width: 348px; height: 368px;}
#blog {}
</style>
<header>
</header>
<div id="cabecera"></div>
<div id="contenido">
<div id="menubar"></div>
<div id="portada"></div>
<div id="destacado"></div>
<div id="blog"></div>
</div>

</body>
</html>

Lo que quiero hacer es que al redimensionar la ventana del navegador, se quede todo fijo, estatico, que no se menee nada. Y en este codigo el div destacado al hacer mas delgada la pantalla del navegador se mueve hasta que se monta encima de portada, portada se queda fija, lo consegui al ponerle el margin-left... esta vez quiero hacerlo bien, no se si llevo buen camino o que... creo que podria hacerlo poniendo todos los divs sueltos y en posiciones absolutas, pero creo que no es la manera correcta.

Podeis echarme un cable para dejar las cosas fijas y que no se muevan.

Voy un poco al reves, todo el mundo busca diseños adaptativos y yo no... xD, GRACIAS!!