Alinear una imagen a la parte de abajo de la pantalla

leoperez · #1 (**permalink**) 26/03/2006, 09:04

Hola a todos,

Como puedo alinear una imagen al pie de la pantalla?

Usando este código CSS logro alinear una imagen a la parte de arriba:

body {
background-color:#000000;
margin: 0;
padding: 0;
}

y luego en la imagen align="top"

Pero, nada, para alinear la imagen a la parte de abajo de la pantalla, sea cual sea la resolución de la misma no lo consigo.

Alguien puede ayudarme?

Muchas gracias.

Jorolo · #2 (**permalink**) 26/03/2006, 10:00

Hola leoperez.

position: fixed;
http://www.sidar.org/recur/desdi/tra...opdef-position

Un ejemplo.
http://www.forosdelweb.com/showpost....84&postcount=8

JavierB · #3 (**permalink**) 26/03/2006, 10:25

Hola leoperez

Puedes probar con:

Código:

img {position:absolute; bottom:0}

Saludos,

leoperez · #4 (**permalink**) 26/03/2006, 12:00

Hola JavierB,

Muchas gracias. Y ahora como haría para centrar la imagen abajo pero en el centro?

Saludos.

kahlito · #5 (**permalink**) 27/03/2006, 10:15

Hola leoperez, en ese caso puedes meter la imagen por ejemplo en una caja:

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Prueba</title>
<style type="text/css">
img{position:absolute; bottom:0;}
#caja_imagen{
text-align:center;}
</style>

</head>

<body>
<div id="caja_imagen">
<img src="imagen.jpg" alt="Tu imagen" width="71" height="80" longdesc="Probando imagen abajo y en el centro"  />
</div>
</body>
</html>

Saludosss

kahlito · #6 (**permalink**) 27/03/2006, 15:51

Hola de nuevo.

Se me habia olvidado restar el margen izquierdo para que quede justo al centro:

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Probando</title>
<style type="text/css">
#caja_imagen{
text-align:center;
margin-left:-400px;}
img{position:absolute; bottom:0;}
</style>
</head>
<body>
<div id="caja_imagen">
<img src="imagen.jpg" alt="Tu imagen" width="400" height="80" longdesc="Probando imagen abajo y en el centro" /></div>
</body>
</html>

Ahí se le resta el margen izquierdo sumando el ancho de la imagen, en este caso suponiendo que son 400 por ejemplo ylisto.

Saludosss