Busca Preguntas
¿como hago para que una imagen de cualquier tamaño en el centro de la pagina en css?
Ruth S - 2009-03-25 18:57:35 - Programming Design
Hola, quisiera que me ayuden a que cada vez que ingrese una imagen de cualquier tamaño se quede en el centro de la pagina este es mi codigo: index.html <!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"> <head> <link rel="stylesheet" type="text/css" href="style.css"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Informática Empresarial</title> </head> <body> <div class="image"> <img src="calavera1.gif" border="0"></div> </body> </html> style.css @charset "utf-8"; /* CSS Document */ body { background:url(image.jpg) top right no-repeat fixed #FFF; } .image{ position: absolute; top: 50%; left: 50%; margin-top: -219px; margin-left: -288px; }
Mejor Respuesta:
Hola, Primero debes de definir que tanto de heigth va a tener tu sitio asi como también el width ya que si no hay una medida exacta no podras ver el resultado como tu deseas En la instruccion qe tienes asi .image{ position: absolute; top: 50%; left: 50%; margin-top: -219px; margin-left: -288px; } cambiala por: .image{ position: absolute; margin: 50%; } y si quieres poner un ancho por defecto para ver cambio agregale la linea width y heigth antes del margin: Saludos, te invito a visitar mi sitio http://www.ccompuser.com/curso
Respuestas:
LFJAIMESB - 2009-03-26 15:59:08
Hola,
Primero debes de definir que tanto de heigth va a tener tu sitio asi como también el width ya que si no hay una medida exacta no podras ver el resultado como tu deseas
En la instruccion qe tienes asi
.image{
position: absolute;
top: 50%;
left: 50%;
margin-top: -219px;
margin-left: -288px;
}
cambiala por:
.image{
position: absolute;
margin: 50%;
}
y si quieres poner un ancho por defecto para ver cambio agregale la linea width y heigth antes del margin:
Saludos, te invito a visitar mi sitio
http://www.ccompuser.com/curso
 |
||
© 2007 proginternet.com
|
