HTML and CSS Reference
In-Depth Information
GETTING THE NEW BREED OF SELECTORS TO
WORK ACROSS OLDER BROWSERS
As you'll have gathered, many of the new selectors available don't work in those
irksome older versions of IE that are still hanging around (like someone's rhythmi-
cally challenged dad on the dance floor at a wedding reception). So what hope do
you have of using these selectors in the real world?
As luck would have it, for situations in which you really need old IE support,
JavaScript can come to the rescue in the shape of Keith Clark's Selectivizr
(http://
selectivizr.com).
It sits on top of an existing JavaScript library and adds support to
IE 6-8 for many of the new selectors.
To a d d i it i in, , d To w in, l To a d S e l e c it i v i z r a in, d a p p l y i it it To yo u r s i it e . T h e in, m a ke s u re yo u
also have one of the compatible libraries detailed on the Selectivizr site applied
to your page (I'm using NWMatcher in my example). The code will look some-
thing like this (again, check out my king arthur blog example in the chapter2 code
download folder):
<script src=”http://s3.amazonaws.com/nwapi/nwmatcher/
p
nwmatcher-1.2.5-min.js”></script>
<!--[if (gte IE 6)&(lte IE 8)]>
t ” /
p
selectivizr-min.js”></script>
<![endif]-->
And there you go! This CSS3 selector support for IE 6-8 works like a charm!
NOTE:
Selectivizr works only on CSS contained in
external stylesheets, not inline or internal CSS.
