Notes

Hacks Navigateurs

pour isoler IE6, IE7, Opéra, Gecko (FF, Netscape, Camino ...) et WebKit (Safari ...) dans les CSS.

Tags :

Attention, cela n’est que de la bidouille et peut donner du code non valide pour le W3C. À éviter si vous pouvez faire autrement, mais, personnellement, ces quelques petits hacks m’ont souvent sauvé la vie.

(MAJ : j’ai ajouté deux nouveaux hack valides CSS 3 pour cibler Safari 2 ou bien les récents WebKits)


only IE6 :

#bloc {border: green;}
*html #bloc {border: red;} /* only ie6 */

only IE7 :

#bloc {border: green;}
*+html #bloc {border: red;} /* only ie7 */

only Gecko (FireFox, Netscape) :

#bloc {border: green;}
html:not([lang*=""]) #bloc {border: red;} /* only gecko */

only Opéra :

#bloc {border: green;}
html:first-child  #bloc {border: red;} /* only opera */

only Safari (WebKit) :

#bloc {
color: green;
}
/*\*/
html*#bloc {
color:red;/*only safari*/
_color:green;/*only IE6 PC*/
}/**/

Avec la technique ci-dessus vous avez cependant besoin de repréciser le style pour IE6

Un deuxième hack plus simple pour cibler Safari 2 et valide CSS 3 :

body:last-child:not(:root:root) #bloc {
color: red; }/* only Safari 2 */

et enfin son pendant pour Safari 3 et les nouvelles versions de Webkit (valide CSS3) :
(On doit utiliser un filtre @media)

@media all and (min-width: 0px) {
            body:not(:root:root) #bloc {
color: red; }/* only webkit */
   }

Plus d’exemples : http://zonecss.free.fr/courscss/cou...
et : http://www.stormdetector.com/hacks/...
et ce très bon lien : http://thomas.tanreisoftware.com/?p=11

© 2017 - Abel Poucet web design