La forma prolija y limpia de hacerlo es usando hojas de estilo independientes para los navegadores obsoletos de esta forma:<div><br></div><div><pre style="padding:5px;margin-top:0px;margin-bottom:0px;overflow:auto"><font face="Consolas, Courier, monospace"><span style="font-size:12px;line-height:16px"><!--[if lte IE 7]>
<link href="/css/ie.css" rel="stylesheet" type="text/css" />
<![endif]--></span></font></pre><div><br></div>Dentro de este archivo se pueden usar hacks css para las distintas versiones, y esto no perjudica en la validacion, o tambien se puede usar un archivo diferente para cada navegador, aunque la mayoria de los problemas yo los corrijo poniendo esto:</div>
<div><br></div><div>div{</div><div>position: relative;</div><div>display:block;</div><div>z-index:1;</div><div>zoom:1;</div><div>}</div><div><br></div><div>el resto dejo que se cargue de la hoja de estilos general y esto soluciona la mayoria de los problemas, a veces con algunas variantes.</div>
<div><br></div><div>Saludos</div><div><br></div><div><br><pre style="padding:5px;margin-top:0px;margin-bottom:0px;font-family:Consolas,Courier,monospace;overflow:auto;font-size:12px;line-height:16px"><br></pre><br><div class="gmail_quote">
El 19 de marzo de 2013 12:36, Juan Manuel P. <span dir="ltr"><<a href="mailto:tucu_21@hotmail.com" target="_blank">tucu_21@hotmail.com</a>></span> escribió:<br><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
<div><div dir="ltr">Muchas gracias mati por los articulos, algo habia encontrado, pero hubo cosas que no habia leido que aparecian ahi.<br><br>Por otro lado encontre tambien un script que incorporandolo al codigo entre los condicionales de IE y dentro de todo (para salvar las papas hasta que terminara las hojas de estilo de IE me salvo - html5shiv.js-).<br>
<br>Saludos, Juan Manuel<br><br>In his heart, in his eyes<br>In his soul, there’s no sign of thunder<br>Screams, can you hear the screaming<br>When another restless soul must die<br><br><div><div></div><hr>Date: Tue, 19 Mar 2013 12:14:10 -0300<br>
From: <a href="mailto:cesargimenezlascano@gmail.com" target="_blank">cesargimenezlascano@gmail.com</a><br>To: <a href="mailto:php-avanzado@pato2.fi.mdp.edu.ar" target="_blank">php-avanzado@pato2.fi.mdp.edu.ar</a><br>Subject: Re: [Php-avanzado] Consultas Hojas de Estilo para IE<div>
<div class="h5"><br><br><div dir="ltr">No había visto tu mensaje Matias, gracias x la info!!! </div><div><br><br><div>El 19 de marzo de 2013 10:16, Matias Gea <span dir="ltr"><<a href="mailto:matigea@gmail.com" target="_blank">matigea@gmail.com</a>></span> escribió:<br>
<blockquote style="border-left:1px #ccc solid;padding-left:1ex"><div dir="ltr">Hola, Juan Manuel.<br><br>Este es uno de los peores "karmas" con los que cargamos al diseñar páginas para el publico en general. El uso de IE < 9 sigue siendo muy alto, y aunque ya las grandes empresas (Facebook, Google, e incluso Microsoft) definieron como obsoleto a IE6 y en algunos casos IE7, hay mucho navegadores con IE8, varios con IE7 y algunos con IE6.<br>
<br>Después de definir el tipo de público al que está apuntado el sitio, hay que tomar una política de soporte, ya que mantener 4 hojas de estilo distintas a veces es una tarea muy demandante. Si decidis soportar alguno de los IE que te falla, la forma más correcta es usar comentarios condicionales (<a href="http://css-tricks.com/how-to-create-an-ie-only-stylesheet/" target="_blank">http://css-tricks.com/how-to-create-an-ie-only-stylesheet/</a>, <a href="http://msdn.microsoft.com/en-us/library/ms537512%28v=vs.85%29.aspx" target="_blank">http://msdn.microsoft.com/en-us/library/ms537512(v=vs.85).aspx</a>).<br>
<br>Esto permite que tu código quede libre de hacks y siga siendo válido.<br><br>Los CSS hacks son modificaciones al css que se le hacen para aprovechar algunas fallas o particularidades que tiene cada uno de los motores de parsing css de los distintos navegadores. Por ejemplo, el motor de IE6 considera válido un elemento anterior al html de la siguiente forma:<br>
* html #div { height: 300px; }<br><br>pero no considera válido un comentario en medio de la declaración:<br>#div { height/**/: 300px; }<br><br>En el primer caso, sólo IE6 va a ver esa regla (el resto de los navegadores la ignora) y en el segundo, IE6 ignora la regla (y para el resto es válida).<br>
<br>Si utilizamos estos hacks, nuestro CSS queda sucio y no válido para el standard.<br><br><br>En el enlace de CSSTricks se concluye de una manera muy acertada sobre el uso de Conditional Comments:<br><br>Argument against conditional stylesheets<br>
- We shouldn't need them. They are against the spirit of web standards.<br><br>Argument for conditional stylesheets<br>- Yeah, but we do need them.<div><br></div><div><br></div><div>Cualquier cosa consultá.</div>
<div><br></div><div>Saludos!<br><br><br><br><br>El 18 de marzo de 2013 20:19, Juan Manuel P. <<a href="mailto:tucu_21@hotmail.com" target="_blank">tucu_21@hotmail.com</a>> escribió:<div><div><br>><br>
> Buenas tardes a todos, quisiera consultarles como es que en general suelen manejar las hojas de estilos (CSS) para el Internet Explorer, en particular para las versiones 6-7-8, ya que me he encontrado con varios inconvenientes que desconocia.<br>
> Luego de realizar algunos diseños, probarlos en Firefox, Opera, Chrome, Safari e IE9 (en Windows 7) que son los que tenia a disposicion. Pero estando en la casa de un conocido que tenia una computadora relativamente vieja con XP e IE8 me encontre que las hojas de estilo que habia realizado casi no servian. Buscando encontre unos "hacks", asi los denominan, para IE6-IE7-IE8.<br>
><br>> Me gustaria saber si cuando tienen que hacer trabajos que parametros (por ejemplo, hacer que su diseño funcione en la ultima version de todos los navegadores y la anterior) toman en cuenta y si consideran hacer plantillas especiales para IE6-IE7-IE8?<br>
><br>><br>> Saludos,<br>><br>> Juan Manuel<br>><br>> PD: si encuentran algun tipo de correccion a terminos utilizados de forma incorrecta, les pido los omitan y las respuestas sean alusivas a la consulta realizada. Todos sabemos, algunos un poco menos que otros, no es necesario demostrarlo todo el tiempo, queda mal.<br>
><br></div></div>> _______________________________________________<br>> Php-avanzado mailing list<br>> <a href="mailto:Php-avanzado@pato2.fi.mdp.edu.ar" target="_blank">Php-avanzado@pato2.fi.mdp.edu.ar</a><br>
> <a href="http://www3.fi.mdp.edu.ar/cgi-bin/mailman/listinfo/php-avanzado" target="_blank">http://www3.fi.mdp.edu.ar/cgi-bin/mailman/listinfo/php-avanzado</a><br>
<br><br><br><br>--<br>Matias Fernando Gea<br><a href="mailto:matigea@gmail.com" target="_blank">matigea@gmail.com</a><br><a href="http://www.mfgea.com.ar" target="_blank">http://www.mfgea.com.ar</a><br></div></div>
<br>_______________________________________________<br>
Php-avanzado mailing list<br>
<a href="mailto:Php-avanzado@pato2.fi.mdp.edu.ar" target="_blank">Php-avanzado@pato2.fi.mdp.edu.ar</a><br>
<a href="http://www3.fi.mdp.edu.ar/cgi-bin/mailman/listinfo/php-avanzado" target="_blank">http://www3.fi.mdp.edu.ar/cgi-bin/mailman/listinfo/php-avanzado</a><br></blockquote></div><br></div>
<br>_______________________________________________
Php-avanzado mailing list
<a href="mailto:Php-avanzado@pato2.fi.mdp.edu.ar" target="_blank">Php-avanzado@pato2.fi.mdp.edu.ar</a>
<a href="http://www3.fi.mdp.edu.ar/cgi-bin/mailman/listinfo/php-avanzado" target="_blank">http://www3.fi.mdp.edu.ar/cgi-bin/mailman/listinfo/php-avanzado</a></div></div></div> </div></div>
<br>_______________________________________________<br>
Php-avanzado mailing list<br>
<a href="mailto:Php-avanzado@pato2.fi.mdp.edu.ar">Php-avanzado@pato2.fi.mdp.edu.ar</a><br>
<a href="http://www3.fi.mdp.edu.ar/cgi-bin/mailman/listinfo/php-avanzado" target="_blank">http://www3.fi.mdp.edu.ar/cgi-bin/mailman/listinfo/php-avanzado</a><br></blockquote></div><br></div>