Foros del Web » Creando para Internet » CSS »

Centrar div verticalmente

Estas en el tema de Centrar div verticalmente en el foro de CSS en Foros del Web. Hola buenas, tengo un pequeño problema a la hora de centrar mi div dentro de mi página. El div en cuestión está dentro de una ...
  #1 (permalink)  
Antiguo 22/01/2010, 09:54
Avatar de sir_bowen  
Fecha de Ingreso: junio-2005
Mensajes: 184
Antigüedad: 12 años, 6 meses
Puntos: 0
Centrar div verticalmente

Hola buenas,

tengo un pequeño problema a la hora de centrar mi div dentro de mi página. El div en cuestión está dentro de una tabla, ya que toda la página está compuesta así. Pretendo hacer un div contenedor, que contenga otros tantos, para dibujar un marco, y poder meter código en el div central. Paso a poner el código para explicarme mejor:

Código HTML:
<table align="center" border="0" width="100%" cellspacing="0" cellpadding="0">
    <tr>
        <td align="center">
            <div id="divContenedor">
                <div id="divLeft">
                </div>
                <div id="divCenter">
                    <div id="divTop">
                    </div>
                    <div id="divMiddle">
                    </div>
                    <div id="divBottom">
                    </div>
                </div>
                <div id="divRight">
                </div>
            </div>
        </td>
    </tr>
...
La composición de los divs dentro de 'divContenedor' me sale perfecta, cada uno de ellos tiene un backgroung-image, y acabo generando un marco perfecto con todas las imágenes. Pero el 'divContenedor', me sale alineado a la izquierda dentro de la celda de la tabla, y no consigo centrarlo.

El CSS que le pongo es:
Código:
#divConteneder{
        position: relative;
        float: left;
        width: 650px;
        height: 300px;
        overflow: auto;
    }
Alguien puede echarme un cable?

Muchas gracias de antemano

Salu2!!
  #2 (permalink)  
Antiguo 22/01/2010, 10:05
 
Fecha de Ingreso: agosto-2007
Mensajes: 140
Antigüedad: 10 años, 3 meses
Puntos: 0
Respuesta: Centrar div verticalmente

Es realmente necesario que el div este dentro de la tabla?

Puedes centrar un div de manera horizontal sin necesidad de que este dentro de la tabla, prueba este código:

div.contenedor
{
width:962px;
display: block;
margin: 0 auto 0 auto;
}

No se te olvide poner el ancho, si no lo tiene no funciona
  #3 (permalink)  
Antiguo 22/01/2010, 10:05
 
Fecha de Ingreso: mayo-2009
Ubicación: Fuerteventura
Mensajes: 324
Antigüedad: 8 años, 7 meses
Puntos: 19
Respuesta: Centrar div verticalmente

Hola! ¿por qué float:left y position:relative? ¿no te va así?:

Código CSS:
Ver original
  1. #divConteneder{
  2.         margin: 0 auto;
  3.         width: 650px;
  4.         height: 300px;
  5.         overflow: auto;
  6.     }

Salud!

P.D. edugonch, parece que hemos posteado a la vez
  #4 (permalink)  
Antiguo 22/01/2010, 10:25
Avatar de sir_bowen  
Fecha de Ingreso: junio-2005
Mensajes: 184
Antigüedad: 12 años, 6 meses
Puntos: 0
De acuerdo Respuesta: Centrar div verticalmente

Qué rápidos!!

Me han servido las dos soluciones

Muchas gracias

Un saludo

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 09:56.