Foros del Web » Creando para Internet » CSS »

Como centrar una capa

Estas en el tema de Como centrar una capa en el foro de CSS en Foros del Web. 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 ...
  #1 (permalink)  
Antiguo 09/02/2009, 11:05
 
Fecha de Ingreso: febrero-2009
Mensajes: 159
Antigüedad: 8 años, 10 meses
Puntos: 1
Como centrar una capa

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
  #2 (permalink)  
Antiguo 09/02/2009, 11:17
Avatar de javiro  
Fecha de Ingreso: febrero-2006
Mensajes: 48
Antigüedad: 11 años, 10 meses
Puntos: 1
Respuesta: Como centrar una capa

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!
  #3 (permalink)  
Antiguo 09/02/2009, 12:02
 
Fecha de Ingreso: febrero-2009
Mensajes: 159
Antigüedad: 8 años, 10 meses
Puntos: 1
Respuesta: Como centrar una capa

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&iacute;tulo</title>
<style type="text/css">
<!--
#Layer1 {
position:absolute;
left:150px;
top:73px;
width:171px;
height:85px;
z-index:1;
}
-->
</style>
</head>

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

Cualquier ayuda me sirve, saludos a todos.
  #4 (permalink)  
Antiguo 09/02/2009, 12:09
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Respuesta: Como centrar una capa

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

  #5 (permalink)  
Antiguo 09/02/2009, 12:13
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Como centrar una capa

¿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 )
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #6 (permalink)  
Antiguo 09/02/2009, 13:23
 
Fecha de Ingreso: febrero-2009
Mensajes: 159
Antigüedad: 8 años, 10 meses
Puntos: 1
Respuesta: Como centrar una capa

Gracias, me salvaste la jugada kseso?, funciono perfecto.
Saludos
  #7 (permalink)  
Antiguo 09/02/2009, 13:28
 
Fecha de Ingreso: enero-2003
Ubicación: Córdoba, Argentina
Mensajes: 1.047
Antigüedad: 14 años, 10 meses
Puntos: 10
Respuesta: Como centrar una capa

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.
__________________
oohh... quisiera ser godines!!!
  #8 (permalink)  
Antiguo 09/02/2009, 13:56
 
Fecha de Ingreso: febrero-2009
Mensajes: 159
Antigüedad: 8 años, 10 meses
Puntos: 1
Respuesta: Como centrar una capa

Excelente lo pruebo y te digo.
  #9 (permalink)  
Antiguo 09/02/2009, 14:53
Avatar de poison_mayer  
Fecha de Ingreso: julio-2008
Mensajes: 69
Antigüedad: 9 años, 5 meses
Puntos: 2
Respuesta: Como centrar una capa

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.
__________________
longtemps je me suis couché de bonne heure
  #10 (permalink)  
Antiguo 09/02/2009, 17:29
 
Fecha de Ingreso: febrero-2009
Mensajes: 159
Antigüedad: 8 años, 10 meses
Puntos: 1
Respuesta: Como centrar una capa

Poison_mayer, porq decis q me va a dar problemas?, con las siguientes capas que inserte hago lo que los demas usuarios me dijeron......
  #11 (permalink)  
Antiguo 10/02/2009, 06:54
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Respuesta: Como centrar una capa

Cita:
Iniciado por kseso? Ver Mensaje
(¡qué dura la tienes, Dragón )
!!!!!! y eso que no tomo la pastillita todavía!!!!!!

Abrazo amigazo!!!!!!!!
  #12 (permalink)  
Antiguo 10/02/2009, 16:16
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Como centrar una capa

Cita:
Iniciado por DragonX Ver Mensaje
!!!!!! y eso que no tomo la pastillita todavía!!!!!!
jajajajajaja
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




La zona horaria es GMT -6. Ahora son las 09:59.