IE8 conditional javascript not linking

Question

here's a landing page I've coded up:

http://rsa-partner.com/

It all looks fine in every browser bar IE8. In IE8, the advanced CSS selector 'nth child' is not recognised.

I downloaded and linked selectivizr.js (http://selectivizr.com/), which should have sorted it in ie, but alas, the background images that show on all my nth child selectors are not showing. The code is

<!--[if (gte IE 6)&(lte IE 8)]>
<script type="text/javascript" src="js/selectivizr-min.js"></script>
<![endif]-->

Is there something I'm missing? I swear I've used conditional IE specific comments before and got nothing back. Any suggestions would be much appreciated.

Of course I could simply remove my nth child selectors and replace with specific classes but I'd like to avoid that if possible!

Answer 1

If your content is loaded in dynamically (like if you are using a CMS system), then it gets loaded after Selectivizr is run, and therefore it won't work.

From selectivzr.com:

The emulation is not dynamic. Once the styles are applied they are fixed so changes to the DOM won't be reflected.

I recommend using Modernizr instead. You can check for css-lastchild and customize the styles if the browser doesn't support it (together with the rest of the CSS3 selectors, like nth-child, etc.). I share your pain though!