Foros del Web » Creando para Internet » CSS »

Alinear una imagen a la parte de abajo de la pantalla

Estas en el tema de Alinear una imagen a la parte de abajo de la pantalla en el foro de CSS en Foros del Web. 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 ...
  #1 (permalink)  
Antiguo 26/03/2006, 09:04
 
Fecha de Ingreso: marzo-2005
Mensajes: 142
Antigüedad: 12 años, 8 meses
Puntos: 0
Alinear una imagen a la parte de abajo de la pantalla

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.
  #2 (permalink)  
Antiguo 26/03/2006, 10:00
 
Fecha de Ingreso: octubre-2005
Mensajes: 536
Antigüedad: 12 años, 1 mes
Puntos: 1
Hola leoperez.

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

Un ejemplo.
http://www.forosdelweb.com/showpost....84&postcount=8
  #3 (permalink)  
Antiguo 26/03/2006, 10:25
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 9 meses
Puntos: 771
Hola leoperez

Puedes probar con:
Código:
img {position:absolute; bottom:0}
Saludos,
  #4 (permalink)  
Antiguo 26/03/2006, 12:00
 
Fecha de Ingreso: marzo-2005
Mensajes: 142
Antigüedad: 12 años, 8 meses
Puntos: 0
Hola JavierB,

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

Saludos.
  #5 (permalink)  
Antiguo 27/03/2006, 10:15
Avatar de kahlito
Colaborador
 
Fecha de Ingreso: marzo-2003
Ubicación: En el Estrecho y el mar
Mensajes: 2.893
Antigüedad: 14 años, 9 meses
Puntos: 60
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
  #6 (permalink)  
Antiguo 27/03/2006, 15:51
Avatar de kahlito
Colaborador
 
Fecha de Ingreso: marzo-2003
Ubicación: En el Estrecho y el mar
Mensajes: 2.893
Antigüedad: 14 años, 9 meses
Puntos: 60
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
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:11.