como hago para que se vea bien en IE

kaiser07 · #1 (**permalink**) 25/06/2009, 05:23

hola, he hecho esto en css

#toolbar {
position: fixed;
bottom:0;
z-index:5;
}

y en firefox se ve bien pero en ie no, como lo puedo solucionar gracias

Triby · #2 (**permalink**) 25/06/2009, 05:26

En www.araudi.net hay un ejemplo para solucionar eso.

AlbertoGarcia · #3 (**permalink**) 25/06/2009, 06:49

Hola puedes cambiar la posición de #toolbar a absoluta para ie6 con un condicional o con un hack como este:

* html #toolbar {
position: absolute;
}

Si quieres que tu css sea válida usa una hoja de estilos aparte para ie6 y enlázala con un condicional.

Salud!

kaiser07 · #4 (**permalink**) 26/06/2009, 05:23

ok merci, voy a probar

kaiser07 · #5 (**permalink**) 26/06/2009, 11:48

sigue sin funcionar, en ie, se queda fija al final, si se ha de bajar la pagina, no va

AlbertoGarcia · #6 (**permalink**) 26/06/2009, 12:31

Debería, porque ie6 confunde absolute con fixed. Míra como está hecho en esta página.

Salud!

kaiser07 · #7 (**permalink**) 26/06/2009, 13:55

lo malo es que uso ie8

AlbertoGarcia · #8 (**permalink**) 26/06/2009, 15:29

Entonces no deberías tener el problema que planteas en tu primer post, este navegador teine solucionado el problema que te comenté antes con la posición fija. Precisamente estoy acabando una maqueta con un pie fijo donde puedes comprobar que funciona en ie8, es esta. Si te sirve el código cópialo tranquilamente. De todos modos si nos dejas ver tu código o nos das un enlace para poder ver el problema te podemos ayudar mejor, todo esto aparte de detallar un poco más cual es el problema exactamente y así no andamos especulando.

Salud!

kaiser07 · #9 (**permalink**) 27/06/2009, 04:47

el codigo que yo uso es este, en mozilla se ve bien pero en ie8 no

Código:

#barrablue {
background:#32558F none repeat scroll 0 0;
bottom:0;
height:29px;
left:0;
margin:0;
min-height:29px;
position:fixed;
text-align:center;
width:100%;
z-index:99999;
}

.encabezado{
	color:#FFF;
	font-family:Verdana,Arial,sans-serif;
	font-size:13px;
	font-weight:bold;	
}
<div id="barrablue">
<span class="encabezado">
Bienvenido a SoftyHard
</span>
</div>

El error esta en que quiero una barra similar a la que tu tienes en la pagina esa de albertogarcia, y lo que ocurre es que en mozilla se ve bien pero en ie8 no, por cierto con tu codigo se ve perfecto. pero en el mio donde esta el error?
gracias

willyfc · #10 (**permalink**) 27/06/2009, 08:58

Con el último código que posteas si se ve bien, ahora mi pregunta es si tienes un dtd definido en el documento, debería ser algo así:

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>

valga decir que esto en IE6 no va a funcionar ya que no entiende la propiedad fixed. Para eso mejor utilizas este ejemplo que hizo mikmoro

willyfc · #11 (**permalink**) 27/06/2009, 09:06

Adaptando el código de Mikmoro a tu código(obviamente mas o menos), esto te puede servir:

Código html:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es-es"> 
<head> 
<title>Ejemplo</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
<meta name="Keywords" content="recursos, css, diseño web, xhtml, software libre" /> 
<meta name="Description" content="Posicion fija para IE6 (fixed) - Recursos CSS - araudi.net" /> 
<meta name="Author" content="Mikel Morote Donazar - Praxis Iru&ntilde;ea SLL" /> 
<meta name="Subject" content="Recursos CSS" /> 
<meta name="Language" content="espa&ntilde;ol" /> 
<meta name="Robots" content="index, follow" /> 
<link rel="alternate" href="http://www.araudi.net/indice.html" title="Indice de contenidos" media="all" lang="es" /> 
<style type="text/css"> 
* {margin:0; padding:0;}
html, body {width:100%; 
height:100%; 
overflow:hidden; 
}
#contenido {width:100%; 
height:100%;
overflow: auto;
} 
#barrablue {
background:#32558F none repeat scroll 0 0;
position:absolute;
width:100%;
height:200px;
bottom:0;
height:29px;
left:0;
margin:0;
min-height:29px;
text-align:center;
width:100%;
z-index:99999;
}
.encabezado{
    color:#FFF;
    font-family:Verdana,Arial,sans-serif;
    font-size:13px;
    font-weight:bold;   
}
</style> 
</head> 
<body> 
<div id="contenido"> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
<p>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</p> 
</div> 
<div id="barrablue"><span class="encabezado">Bienvenido a SoftyHard</span></div> 
</body> 
</html>

Espere que te sea de ayuda, este sería con el código del vínculo que te pase en el post anterior.

kaiser07 · #12 (**permalink**) 27/06/2009, 11:47

gracias a todos.
@ willyfc-> va de lujo gracias

willyfc · #13 (**permalink**) 27/06/2009, 12:05

Que bueno que te sirvió