Ayuda cuadrar la posicion de un div

helacer · #1 (**permalink**) 08/07/2010, 16:34

COmo estan

Tengo un div que muestra un mensaje. este div esta ubicado en la esquina superior derecha.

La pagina tiene barra de scroll vertical. Lo que deseo es que cuando se baje la barra de scroll tambien se baje el div para que este no se oculte

Que estilo le coloco al div para que haga esto?

deirdre · #2 (**permalink**) 08/07/2010, 17:08

Hola helacer

Al div que quieres hacer fijo le tienes que aplicar la propiedad "fixed" (o sea: position: fixed). Esto te funciona en todos los navegadores menos en iexplorer 6 (para el que tienes que buscar otra solución)

Código 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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Caja fija</title>
<style type="text/css">
#fija {
	position: fixed;
	right: 0;
	top: 0;
	height: 50px;
	width: 150px;
	border: 1px solid #444;
}
</style>
</head>

<body>
<div id="fija">Caja fija</div>
</body>

</html>

Saludos

*busca el arreglo para ie6 y si no lo encuentras, pídelo que te lo busco entre mis códigos (ahora no estoy en el lugar en el que los tengo).

alexk · #3 (**permalink**) 08/07/2010, 17:33

Cita:

Iniciado por deirdre

Hola helacer

Al div que quieres hacer fijo le tienes que aplicar la propiedad "fixed" (o sea: position: fixed). Esto te funciona en todos los navegadores menos en iexplorer 6 (para el que tienes que buscar otra solución)

Código 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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Caja fija</title>
<style type="text/css">
#fija {
	position: fixed;
	right: 0;
	top: 0;
	height: 50px;
	width: 150px;
	border: 1px solid #444;
}
</style>
</head>

<body>
<div id="fija">Caja fija</div>
</body>

</html>

Saludos

*busca el arreglo para ie6 y si no lo encuentras, pídelo que te lo busco entre mis códigos (ahora no estoy en el lugar en el que los tengo).

tambien puede usar el buscador que es un tema muy tratado...
http://www.forosdelweb.com/f53/posit...xed-ie-659655/