Pail Irish posted a nice concise list of CSS hacks for targeting specific browsers. While I'd love to avoid using hacks altogether, I just continually find cases where it's necessary so this list is a handy little reference:
/***** Selector Hacks ******/ /* IE 6 and below */ * html #uno { color: red } /* IE 7 and below */ *:first-child+html #dos { color: red } /* IE 7 and modern browsers */ html>body #tres { color: red } /* Modern browsers (not IE 7) */ html>/**/body #cuatro { color: red } /* Opera 9.27 and below */ html:first-child #cinco { color: red } /* Safari */ html[xmlns*=""] body:last-child #seis { color: red } /*safari 3+, chrome 1+, opera9+, ff 3.5+ */ body:nth-of-type(1) #siete { color: red } /* safari 3+, chrome 1+, opera9+, ff 3.5+ */ body:first-of-type #ocho { color: red } /* saf3, chrome1+ */ @media screen and (-webkit-min-device-pixel-ratio:0) { #diez { background: #FFDECE; border: 2px solid #ff0000 } } /***** Attribute Hacks ******/ /* ie6 and below */ #once { _color:blue } /* ie7 and below */ #doce { *color: blue } /* or #color:blue */ /* 'Modern Browsers' includes IE8, whether you agree or not.. :) */
I did notice that the "*" hack (i.e. "*color: blue") also seems to get picked up by IE8, while he lists the hack as for being for IE7 and below.
Paul even set up a test page with all the hacks for testing.
Nice job Paul!
Comments for this entry have been disabled.