Comunidad de diseño web y desarrollo en internet online

Centrar una capa dentro de otra

Citar            
MensajeEscrito el 25 Nov 2006 11:44 am
Hola! Les escribo porque no sé como hacer para centrar una capa dentro de otra. Estas son las capas:

#fondo_cuerpo{
position:inherit;
width:100%;
height:auto;
background:#e5eff8;
z-index:2;
}

#cuerpo{
position:inherit;
background:url(imagenes/fondo_cuerpo.gif);
background-repeat:repeat-y;
width:auto;
height:150px;
z-index:1;
}


Lo que quiero es que la capa #cuerpo aparezca dento de la capa #fondo_cuerpo pero centrada, en mitad de la pantalla. He probado esto:

<div id="fondo_cuerpo">
<div id="cuerpo" align="center"></div>
</div>


Y esto otro:

<div id="fondo_cuerpo">
<div align="center"> <div id="cuerpo"></div></div>
</div>

Pero no me funciona. Alguna idea??

Mil gracias desde ya.

Por Prometeo2006

122 de clabLevel



 

firefox
Citar            
MensajeEscrito el 25 Nov 2006 12:22 pm
Lee esta respuesta y este tutorial

PD: Que alguien ponga un postIt que diga como centrar capas. :lol:

Por ryuz

350 de clabLevel

2 tutoriales

 

firefox
Citar            
MensajeEscrito el 25 Nov 2006 04:17 pm
Hola ryuz! Antes de nada, muchas gracias por contestar. La verdad es que no me funciona.
Saludos.

Por Prometeo2006

122 de clabLevel



 

firefox
Citar            
MensajeEscrito el 25 Nov 2006 05:07 pm
Ya lo he solucionado con tablas ;-)

Por Prometeo2006

122 de clabLevel



 

firefox
Citar            
MensajeEscrito el 25 Nov 2006 07:09 pm
Prometeo, no te recomiendo para nada el uso de tablas en maquetación. Estas estan pensadas para el uso de datos y no para el formato de la pagina. Lo mejor es usar divs.
Posiblemente, el centrado no te funciona pues no has especificado un ancho. Un ejemplo de centrado basico seria el siguente:

Código :

<style type="text/css">
#contiene{
width:200px;
height:200px;
border:#000 solid 1px;
}
#centrado{
width:100px;
height:100px;
margin: 0 auto !important;
border:#FC0 solid thin;
}
</style>
<!--[if IE]>
<style>
#contiene{
text-align:center;
}
#centrado{
text-align:left;
}
</style>
<![endif]-->
<div id="contiene">
   <div id="centrado">
      Estoy centrado!
   </div>
</div>

Como veras esta centrado. Nuestro odiado IE 6, sin embargo, no acepta el margin:0 auto, asi que la solucion es centrar el texto del contenedor, y luego mandar otra vez el contenido de "centrado" a la izquierda. Eso es lo de las condicionales
Es un poco mas de codigo, pero te ahorra mucho trabajo, ademas de que estaras desarrollando correctamente.

Saludos!

Por Lunatic Lycanthrop

Claber

1203 de clabLevel

7 tutoriales

1 ejemplo

Genero:Masculino  

The dark places where wolves access internet with 46,6 kbps

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.