Ver Mensaje Individual
  #2 (permalink)  
Antiguo 21/11/2006, 09:26
Avatar de ebe
ebe
 
Fecha de Ingreso: marzo-2004
Ubicación: Guatemala
Mensajes: 363
Antigüedad: 20 años, 1 mes
Puntos: 11
float y clear.

una de las opciones mas utilizadas que puedes usar es la siguiente:

<!-- div contenedor , encerrara todos los otros divs, este estilo centrara tu div y se extendera si los div internos requireren mas altura -->
<div style="width:770px; margin-right:auto; margin-left:auto; overflow:hidden; padding:4px 4px 4px 4px">

<div style="width:760px; clear:both; background-color:#FFCC00; margin-bottom:5px; margin-left:2px">Contenido header</div>

<div style="width:370px; float:left; background-color:#CCCCCC; margin-right:5px">Contenido div izquierda</div>

<div style="width:390px; float:left; background-color:#336699">contenido segundo div</div>

</div>


primero crea un div contenedor (el que encerrara todos los otros divs) luegos dentro de este div ingresa todos aquiellos divs para tus diferentes secciones proporcionandoles anchos (width) y todos aquellos estilos con los que desees formatear tu contenido y presentacion de dicho div.

como puedes ver lo que hace el trabajo aqui es la propiedad float que permite posicionar tus divs (en este caso en una forma liquida) a tus necesidades, en el div superior utilizas la propiedad clear:both para evitar que contenido se posiciones a la derecha o izquierda de este div.

PD. si deseas poner unicamente dos divs en una misma fila puedes utilizar float: right, de ahi manejas los anchos de tus divs para que tu diagramacion sea lo mas lineal que necesites.

margin-right:auto y margin-left:auto permiten posicionar tu contenedor al centro del viewport (pantalla del navegador), NOTA: utiliza text-align:center si tus paginas son para navegador internet exploers 5.x.
Dudas??

un saludo.
__________________
http://dev.wsnetcorp.com