Migrando a CSS :D

Hola!
Estoy queriendo dejar a un lado las tablas para los diseños de mis páginas, y al intentar hacer una página que tenga un menú al lado izquierdo y el contenido al 100% en css, no mas no me jala, me pone el contenido abajo del menu, ojala y alguien me pudiera dar una manita.
Así lo hacía antes en HTML:

Código :

<table width="100%" cellpadding="3">
<tr>
   <td>Encabezado</td>
</tr>
</table>
<table width="100%" cellpadding="3">
<tr>
<td width="120" valign="top">este es el menu</td>
<td width="100%" valign="top">aqui va el contenido principal de la pagina</td>
</tr>
</table>

Desde ya, Grax!

PD. algun tutorial para maquetar formularios?

Has probado a poner el menú al 15% y el contenido al 85%???Despues un float:left para el menu y un float:right para el contenido

Ese problema se presenta en firefox pero el IE se ve bien el problema parece ser con el porcentaje, si estas determinando el ancho con CSS (width) puedes probar el valor de auto an lugar de 100%

GersonM

Hola

Proba con esto para la estructura del sitio (esto lo metes dentro del body)

Código :

<div class="contenedor">
   <div class="header">
   esto es el header
   </div>
   <div class="contenedorInterno">
       <div class="menu">
       sdfsd<br />kghdfkgf
       </div>
       <div class="contenido">
       aca va el contenido
       </div>
   </div>
   <div class="footer">
   pie de pagina
   </div>
</div>

y usa este css

Código :

*
{
   margin:0px;
   padding:0px;
}
body
{
   text-align:center;
}
.contenedor
{
   margin:0px auto 0px auto;
   width:600px;
   background:#FF0000;
   text-align:left;
}
.contenedor .header
{
   width:200px;
   background:#FFFF00
}
.contenedor .contenedorInterno div
{
   float:left;
}
.contenedor .contenedorInterno .menu
{
   width:20%;
   background:#00FF00;
}
.contenedor .contenedorInterno .contenido
{
   width:80%;
   background:#0000FF;
}

.contenedor .footer
{
   clear:both;
   width:200px;
   background:#FFFF00
}

Funciona bien tanto en IE, FF, opera y mac

Espero q te sirva

y mac??? yo uso el fire fox para acceder a internet, pero jamas eh accedido diractamente de mi mac... jejeje un chistesillo solamente, se entiende perfectamente lo que tratas de decir... bueno, ya, podriamos solucionarle su problema al muchacho, es mas podrias incluso hacerle su sitio (ojo hacerle, yo no, al menos no gratis jejeje...) pero la idea no es tanto solucionarle el problema, como dejarlo que aprenda,

Amigo mio, lo que sucede y en donde esta el@#$%#@$% problema es en lo siguiente, tu estas dando un 100% a tu otro div, desde que lo hacias con tablas asi, ya esta mal, con tablas te lo respeta por que hasta cierto punto una tabla no bajara una celda a otra fila solo por que no "cabe", pero en css no importa, si no cabe, lo baja, ademas por que das un 100%??? no se supone tu menu ya esta ocupando parte de la ventana???, si tu menu ya ocupa una parte de la ventana entonces obiamente ya no sobra el 100% que tu quieres que ocupe el otro div, la mejro colucion es darle un width: auto, como alguien mas ya lo havia dicho. o asignar valores por porcentages a ambos elementos, como ya se dijo antes tambien, solo recuerda que si tienes un elemento ocupando espacio, el espacio libre ya no es 100%, ahi es donde esta tu problema, ademas podria ser tambienq ue no pusiste float a ningun elemento, generalmente con darle un float:left a menu bastaria, pero para mayor seguridad dale float:right al contenido, ademas al pie le das clear:both, si no se te va a subir y se pondra detras de menu y contenido....por que???
simplemente por que con el float estas sacando del flujo estos elementos (menu y contenido)

Pues cuando pones ambos div's el contenido y la navegación dentro de otro div con ancho en auto el contenido se baja, porque no se, pero eso me paso aqui.

Puse los div asi para ver que se acomoden al tamaño de la ventana y no interese si esta en 800 x 600 o en 1024 x 768, estava probando pero solo se baja en FF.

Que puede pasar?

Hola, me fije en el codigo html, estas poniendo el footer fuera del wrap... fijate en meterlo dentro de ese div. Ademas estas poniendo al slide como float right y al contenido como float left... algo q no deberia joder, aunq puede ser q por el orden de los div jodan, fijate en ponerlos los dos como float left o right, y pone los div primero el slide, sino queda bien, pone el contenido primero.
Fijate tambien lo del width=auto q tenes en el contenido, talvez le esta dando un width muy grande y no estra en el espacio q hay, fijate q el contenido esta ocupando todo el ancho del header, y en verdad el ancho del contenido debe ser (anchoHeader - anchoSlide).


saludos!