![Antiguo](http://static.forosdelweb.com/fdwtheme/images/statusicon/post_old.gif)
21/11/2006, 09:26
|
![Avatar de ebe](http://static.forosdelweb.com/customavatars/avatar58469_1.gif) | | | Fecha de Ingreso: marzo-2004 Ubicación: Guatemala
Mensajes: 363
Antigüedad: 20 años, 10 meses 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. |