Buenas, estoy terminando una web y me he llevado una mala sorpresa cuando he entrado desde otro ordenador con IE8. Cambia completamente el maquetado de la web. Os pongo dos imagenes para que lo veais:
Deberia verse así
(http://img15.imageshack.us/img15/2449/captura1ga.jpg)
Y en IE8 Se ve así
(http://img835.imageshack.us/img835/5395/captura2mw.jpg)
Lo más grave es que los dos menús se ponen de forma vertical en vez de horizontal.
Cual puede ser la solución?? Hay alguna forma de hacer que si está entrando desde esos navegadores utilice otro código??
Os dejo algunos fragmentos de código.
#entrada{
padding-top:75px;
text-align:center;
}
#entrada li{
display:inline-block;
margin:0 25px 0 0;
text-align:right;
}
nav ul{
display:inline;
text-align:right;
margin:0 50px 0 0;
position:relative;
}
nav ul li{
display:inline;
text-align:right;
margin:0 50px 0 0;
float:right;
}
al nav ul{} intenta ponerle esto list-style-type: none;
Cuando tu dices:
nav ul{
display:inline;
text-align:right;
margin:0 50px 0 0;
position:relative;
}
Quieres decir que le estas dando estilo a un tag <nav>, si quieres darle estilo a la clase <div class="nav"> debes usar .nav ul{ ... con el punto antes de nav.
Veo que el fondo tiene opacity, recuerda que ie8 no funciona con css3, para eso debes usar filter: alpha()
No te extrañes,yo tengo que hacer hojas de estilo para chrome e internet explorer 8 y 9, el unico que se adapta siempre al estandard es firefox y a veces chrome.
Al ver las etiquetas nav supongo que estas utilizando las etiquetas semanticas de html5
Podes usar HTML5shiv (http://code.google.com/p/html5shiv/) o Modernizr (http://www.modernizr.com/) para adaptar veriones de ie a la actualidad :)
o detectar el user-agent y hacer una web paralela solo para ie6 :xD
eehhm si usa html entonces no le va a funcionar ni a palos porque internet explorer 8 no soporta html5 ni css3 y eso que viene incluido en windows 7.
Efectivamente estoy usando etiquetas de html5 pero he probado el HTML5shiv que mencionó raul338 y es milagroso ;D. Aunque muchos efectos no los hace pero por lo menos el maquetado queda bien ;-)
Muchísimas gracias a todos!
IE-CSS3 (http://fetchak.com/ie-css3/) dice hacer ese trabajo (pero mediante magia negra :xD DirectX y otras yerbas) y Modernizr (http://www.modernizr.com/) tambien aunque es mas pesado :)
mejor no te cuento como se ve en IE7 ;-)
Prueba a poner estas etiquetas META...
<meta http-equiv="X-UA-Compatible" content="IE=6">
<meta http-equiv="X-UA-Compatible" content="IE=7">
<meta http-equiv="X-UA-Compatible" content="IE=8">
prueba, haber si te funciona así. ;)