Tengo, particularmente dos problemas...
1) cuando pongo en un contenedor div's con float al final del contenido, el contenedor no se "alarga" para contener esos divs.
2) se me complica mucho alinear verticalmente elementos y textos dentro de los div's.
Aca va un ejemplo para ver en FF:
http://www.rdgimenez.com/blog/index.php
En este ejemplo que les paso se ven losdos problemas que mas me urgen (vamos, q deben haber mas ).
Para no dar as vueltas, el contenedor blanco no se "estira" y no puedo alinear los textos en los botones de la izqauierda...
Aca va el codigo para ver si pueden explicarme un poco que es lo que estoy haciendo mal:
HTML:
Código :
<html> <head> <link rel="stylesheet" type="text/css" href="css/estilos.css"> <title>|| Darío! Gimenez ||</title> </head> <body> <center> <div id="contenedor"> <div id="head"></div> <div id="headImg"></div> <div id="contenido"> <div id="main"></div> <div id="botonera"> <ul> <li>Menu Uno</li> <li>Menu Dos</li> <li>Menu Tres</li> <li>Menu Cuatro</li> </ul> </div> </div> </div> </center> </body> </html>CSS:
Código :
body{ padding:10px; margin:0px; background-color:#c7c2b0; } #contenedor{ margin:0px auto; /*margin:0px;*/ padding:0 0 0 0; width:800px; border:1px solid #000; background-color:#FFF; } #contenedor div{ margin:20 0 20 0; } #head{ padding:0px; width:760px; height:100px; border:1px solid #000; background-color:#c7c2b0; background-image:url(../img/logo.jpg); background-position:right; background-repeat:no-repeat; } #contenido{ padding:0px; width:760px; text-align:left; } #contenido div{ margin:0px; } #headImg{ padding:0px; width:760px; height:350px; border:1px solid #000; background-image:url(../img/headImg.jpg); background-position:left; background-repeat:no-repeat; } #main{ padding:10px; border:1px solid #000; background-color:#fbf4e2; width:488px; float:left; } #botonera{ margin-right:20px; padding:0px; width:250px; text-align:left; float:right; } #botonera ul{ margin:0 0 0 20; padding:0px; } #botonera ul li{ font:11px verdana; color:#000; margin:0 0 10 0; width:230px; height:30px; list-style:none; border:1px solid #000; background-color:#c2b292; }
Desde ya muchisimas gracias por su atencion