Como centrar una capa

lbazer · #1 (**permalink**) 09/02/2009, 11:05

Hola que tal a todos,
estoy desarrollando una web tableless(sin tablas), debido a varias incompatibilidades que habia tenido con los distintos navegadores, pero mi duda es como centrar las distintas layers que compone mi web, he visto varios tutoriales pero que me la centran conforme a mi resolucion queria saber como poder centrarlas sin importar la resolucion( como podes hacer con las tablas).
Espero respuestas,

Saludos a todos

javiro · #2 (**permalink**) 09/02/2009, 11:17

Para centrar el contenido de algún contenedor, tienes que darle la propiedad text-aling:center al contenedor superior que contiene el que quieres centrar.
Por ejemplo, si quieres centrar el contenedor principal, que lo vamos a llamar cont_prin, en la hora de estilos css tendría que contemplar esto:

Código:

body{
	text-align:center;
}
#cont_prin{
	margin:0 auto;
}

Al identificador cont_prin le vamos a dar la propiedad margin:0 auto; para asegurarnos de que funcione en todos los navegadores.

Salud!

lbazer · #3 (**permalink**) 09/02/2009, 12:02

Gracias por la respuesta pero no me ha funcionado, yo me refiero en la modalidad de Diseño del Dreamweaver tenes la opcion de dibujar capaz donde podes insertar activos, mas capas dentro, etc.... pero no se centrarla sin importar la resolucion.
Les pongo una copia de como se ve mi codigo, asi capaz qe me pueden explicar mejor, en este dibuje una capa simple:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin título</title>
<style type="text/css">

</style>
</head>

<body>
<div id="Layer1"></div>
</body>
</html>

Cualquier ayuda me sirve, saludos a todos.

DragonX · #4 (**permalink**) 09/02/2009, 12:09

si tu capa tiene una posición absoluta, es imposible que se centre en forma relativa

kseso? · #5 (**permalink**) 09/02/2009, 12:13

¿Quieres centrar la caja #layer1?
Con tu código es imposible, le das posición absoluta y unos puntos muy concretos (a 73px de la parte superior y a 150px del borde izquierdo de la página.

Prueba para esa capa estas propiedades:

Cita:

#Layer1 {
position:relative;
margin: 0 auto;
width:171px;
height:85px;
z-index:1;
border: 1px solid #000;
background: #cdcdcd;
}

le he añadido un borde y un fondo para que la veas

Edito por choque
(¡qué dura la tienes, Dragón

)

lbazer · #6 (**permalink**) 09/02/2009, 13:23

Gracias, me salvaste la jugada kseso?, funciono perfecto.
Saludos

safe · #7 (**permalink**) 09/02/2009, 13:28

Ibazer, ¿quieres centar la web solo horizontalmente o tambien verticalmente?
Si es solo horizontalmente solo tienes que agregar lo que dijo Javiro pero sin lo de text-align:center y sacando el position:absolute (tampoco es necesario el position:relative). Si el div Layer1 tiene un ancho definido agregando margin: 0 auto: a #Layer1 va a quedar centrado. Si no te funciona puede deberse a que no tengas definido un DOCTYPE en tu archivo HTML. Y este metodo solo funciona para documentos con DOCTYPE XHTML (transicional o estricto).

Si tambien quieres centrar el DIV de manera vertical ahi si tenes que apelar al posicionamiento absoluto. Pero es necesario que sepas el tamaño exacto del DIV contenedor. De ser asi solo tendrias que agregarle los siguientes estilos:

#Layer1 {
position:absolute;
left:50%;
top:50%;
width:200px;
height:100px;
margin-left:-100px; //la mitad del ancho del div
margin-top:-50px; // La mitad del alto
}

Espero te sirva.

lbazer · #8 (**permalink**) 09/02/2009, 13:56

Excelente lo pruebo y te digo.

poison_mayer · #9 (**permalink**) 09/02/2009, 14:53

Según te entendi ya lograste centrar el primer div y ¿qué harás con los demás? si dejaste bien claro que usas el dreamweaver y sabiendo que cada vez que insertas una layer nueva te va a poner las posiciones absolutas uhmmm me parece que vas a pasar algo de trabajo si antes no estudias un poco de CSS.

lbazer · #10 (**permalink**) 09/02/2009, 17:29

Poison_mayer, porq decis q me va a dar problemas?, con las siguientes capas que inserte hago lo que los demas usuarios me dijeron......

DragonX · #11 (**permalink**) 10/02/2009, 06:54

Cita:

Iniciado por kseso?

(¡qué dura la tienes, Dragón

)

!!!!!! y eso que no tomo la pastillita todavía!!!!!!

Abrazo amigazo!!!!!!!!

jomaruro · #12 (**permalink**) 10/02/2009, 16:16

Cita:

Iniciado por DragonX

!!!!!! y eso que no tomo la pastillita todavía!!!!!!

jajaja