Foros del Web » Creando para Internet » HTML »

Problema al centrar la pagina

Estas en el tema de Problema al centrar la pagina en el foro de HTML en Foros del Web. Hola, tengo un problema y es que estoy intentando centrar dependiendo de la resolucion del monitor el contenido de una pagina web que esta formada ...
  #1 (permalink)  
Antiguo 03/03/2011, 06:49
 
Fecha de Ingreso: enero-2009
Mensajes: 30
Antigüedad: 8 años, 10 meses
Puntos: 0
Problema al centrar la pagina

Hola, tengo un problema y es que estoy intentando centrar dependiendo de la resolucion del monitor el contenido de una pagina web que esta formada por capas.
La idea es tener una capa principal que ocupe toda la pantalla y que haga de fondo, y luego centrar el resto de elementos a esa capa, pero no lo consigo.

He empezado por poner solo el nombre y el mail x ejemplo y el codigo es este:

estos son los estilos:

#apDiv2 {
position:absolute;
left:468px;
top:107px;
width:261px;
height:50px;
z-index:2;
}
#apDiv3 {
position:absolute;
left:286px;
top:107px;
width:174px;
height:56px;
z-index:3;
}
#resolucion {
position:absolute;
width:100%;
height:100%;

}
#pcpal
{
position:absolute;
width:600;
height:100%;

}


Y aqui el resto:

<div id="resolucion">
<div id="pcpal" align="center">
<div id="apDiv3">
<label for="nombre">Nombre y apellidos : </label> <input name="nombre" size="20" maxlength="80" type="text"><br>
</div>
<div id="apDiv2">
<label for="email">Email : </label><input name="email" size="36" maxlength="60" type="text"><br>
</div>
</div>
</div>

Lo he intentado de mil formas pero soy incapaz ¿alguien me puede echar una mano?

Gracias
  #2 (permalink)  
Antiguo 03/03/2011, 15:13
Avatar de sanxuan  
Fecha de Ingreso: enero-2011
Ubicación: Gijón
Mensajes: 671
Antigüedad: 6 años, 11 meses
Puntos: 36
Respuesta: Problema al centrar la pagina

No uses align=center en la etiqueta. Centra el div usando margin:0 auto.
Usa position:relative en div#pcpal para que las posiciones absolutas de apDiv2 y apDiv3 hagan referencia a pcpal y no a la ventana del navegador.
Como pcpal tiene 600px de ancho (te falta la unidad de medida en el código), los valores left de apDiv2 y apDiv3 deben corregirse para que entren dentro. El izquierdo puede tener left:0 o el margen que desees y el derecho debe tener la propiedad left con una distancia igual al ancho del div izquierdo mas los márgenes que quieras dejar (300px en total por ejemplo).

Etiquetas: Ninguno
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 21:30.