Centrar imagen verticalmente. AYUDA x dios!!

florlangosta · #1 (**permalink**) 23/05/2008, 16:02

Es muy simple
solo quiero centrar una imagen , verticalmente en la pantalla del navegador, tenga la resolucion que tenga.

el atributo de tabla HEIGHT="100%", ya no funciona mas en los exploradores nuevos.
No funciona si utilizo el siguiente Doc Type:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

Y no encuentro la forma de hacer con DIVs mediante CSS.
Es posible esto???

al div le pongo el atributo height 100%, pero siempre queda pegado al margen superior !!!!!!!!!
nunca toma la altura total de la pantalla.

geek08 · #2 (**permalink**) 23/05/2008, 17:24

Hola florlangosta..
no entiendo bien tu pregunta, pero seria algo asi?
.algo{float:left;width:100%;margin-top:10px;}

Suerte

florlangosta · #3 (**permalink**) 24/05/2008, 08:48

lo hago mas facil.

Decino en CSS un contenedor el cual quiero que tenga el alto y ancho total de la ventana de navegador, es decir, 100%. Seria asi:

#contendor {
height: 100%;
width: 100%;
}

Luego creo el DIV, asi:

<div id="contendor">Contenido del contenedor</div>

Entonces, el ancho si lo veo al 100% de la ventana, pero el alto NO.
El contenido queda todo contra el margen superior.
No me respeta el alto del 100% de la ventana.

AYUDAAAAAAAAAAAAA!!!

Mikmoro · #4 (**permalink**) 24/05/2008, 16:56

Cita:

Iniciado por florlangosta

Es muy simple
solo quiero centrar una imagen , verticalmente en la pantalla del navegador, tenga la resolucion que tenga.

Cita:

al div le pongo el atributo height 100%, pero siempre queda pegado al margen superior !!!!!!!!!
nunca toma la altura total de la pantalla.

No entiendo bien. ¿Quieres centrar verticalmente una imagen en la pantalla, o quieres que ocupe el 100% de alto? Creo que son cosas diferentes.

Bueno, como creo que la pregunta en realidad es la segunda, te puedo decir que cuando pones a una caja que tenga el 100% de alto, deberá tener el 100% de algo, es decir, de su contenedora. Si en este caso no hay ninguna medida en su caja contenedora, efectivamente dibuja el 100% de... nada.

Esto se resuelve poniéndole altura al html y al body, que son los contenedores de una caja que está puesta directametne tras el body. Purébalo así:

html, body { width: 100%; height: 100%;}

Así les hemos dado tamaño respectivamente, y tu caja podrá ahora tener el 100% del body, que mide el 100% del html, es decir, de tu página.

Espero haberme explicado bien, y espero que te funcione.

Mikel.

florlangosta · #5 (**permalink**) 26/05/2008, 07:53

Excelente Mikmoro !!!!
Buenisima explicacion, funcionó perfecto.

Solo una duda....
Cualquier cosa que pongo dentro de ese DIV, ya sea texto o imagen, me lo margina contra arriba, es decir , contra el margen superior.

Como hago para que lo centre verticalmente dentro del DIV ??

gracias !!!!!!!!!!!!!!