Foros del Web » Creando para Internet » CSS »

No puedo alinear capas.

Estas en el tema de No puedo alinear capas. en el foro de CSS en Foros del Web. Hola, estoy teniendo un problema para alinear la capa del menu con la del contenido. El problema es que en la parte de abajo quedan ...
  #1 (permalink)  
Antiguo 01/05/2010, 11:42
 
Fecha de Ingreso: marzo-2009
Mensajes: 91
Antigüedad: 15 años
Puntos: 1
No puedo alinear capas.

Hola, estoy teniendo un problema para alinear la capa del menu con la del contenido.

El problema es que en la parte de abajo quedan desalineadas.

Por ejemplo
(Las "x" significan que hay contenido...Los "-" significa que hay contenido.)
MEnu Contenido <---div de menu float:left contenddo float:right
xxxxx xxxxxxxxx
xxxxx xxxxxxxxx
xxxxx xxxxxxxxx
xxxxx xxxxxxxxx
----- xxxxxxxxx
----- xxxxxxxxx
-----------------
xxxxxxxxxxxxxxxxx <-- div que contiene el Clear:both;


Aqui les muestro el codigo.
DEntro de los divs menu y contenido hay otros divs. Y quizas una informacion termina antes que la otra. Pero aun asi.quiero que el background de los divs del menu y contenido lleguen al final, osea que queden alineados.


Esto tengo en CSS.

Código CSS:
Ver original
  1. body{
  2. margin:0 auto;
  3. text-align:center;
  4. background-color:#000;
  5. font-family: "New Century Schoolbook", Times, serif;
  6. font-size:14;
  7. height:100&#37;;
  8. width:100%;
  9. }
  10.  
  11. #general{
  12. margin:auto;
  13. position: relative;
  14. text-align:center;
  15. width:900px;
  16. background-image:url(img/pixel.png);
  17. background-repeat:repeat;
  18. overflow:auto;
  19. }
  20.  
  21.  
  22. #menu{
  23. position: absolute;
  24. background-image:url(img/lineaMenu.png);
  25. background-repeat:repetat-y;
  26. margin:auto;
  27. float:left;
  28. width:250;
  29. }
  30.  
  31. #contenido{
  32. margin:0 auto;
  33. float:right;
  34. width:550px;
  35. background-image:url(img/contMiddle.png);
  36. }
  37.  
  38. #break{
  39. clear:both;
  40. margin:0 auto;
  41. }

y en HTML tengo esto

<body>
<div id="general">
<div id="menu">
Esta parte solo contiene botones. En caso de que el div de contenido sea mas grande que este div. este debe rellenar el espacio que sobra con el backgrund. Y biceversa en caso que el contenido sea menor al menu
</div>
<div id="contenido">
ACa va el contenido. varia en distintas secciones
</div>
<div id="break">
&nbsp;
</div>

</div>
</body>

No se porque me esta fallando. Con overflow me ha funcionado. Pero hoy no esta funcionando.

Agradezco soluciones ;D




*************************************EDICION
Ahora que me doy cuenta. El div de break se lo debo sacar
Porque el contenido de la web solo estaria maquetada para menu y contenido.

Si dan una solucion sin el break con el clear:both les agradeceria.

Última edición por fackius; 01/05/2010 a las 11:47
  #2 (permalink)  
Antiguo 02/05/2010, 04:09
 
Fecha de Ingreso: abril-2010
Mensajes: 37
Antigüedad: 14 años
Puntos: 1
Respuesta: No puedo alinear capas.

¿Quiéres que el texto que has introducido en las capas se ajuste automáticamente con la altura?
  #3 (permalink)  
Antiguo 02/05/2010, 07:34
Avatar de hades87  
Fecha de Ingreso: diciembre-2007
Ubicación: Barcelona - España
Mensajes: 3.194
Antigüedad: 16 años, 4 meses
Puntos: 68
Respuesta: No puedo alinear capas.

La verdad que no me acaba de quedar muy claro el problema, podrías poner la web o alguna imagen?
__________________
No diseñes usando tablas.
  #4 (permalink)  
Antiguo 03/05/2010, 13:33
Avatar de anfergon  
Fecha de Ingreso: junio-2009
Mensajes: 44
Antigüedad: 14 años, 10 meses
Puntos: 0
Respuesta: No puedo alinear capas.

Hola:

Hace tiempo tuve el mismo problema y la solución la encontré en esta página. Mira en http://www.forosdelweb.com/f53/aporte-columnas-equilibradas-628274/.

Etiquetas: alinear, capas
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 20:33.