1

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!

Olyvar
  • 39
  • 4
  • That conditional statement does look hinky ? – adeneo Aug 29 '13 at 15:47
  • If you want to target only IE 8, why not use ` – Harry Aug 29 '13 at 15:48
  • Isn't that "greater than IE6 and lower than IE8" ?? – adeneo Aug 29 '13 at 15:49
  • 1
    @adeneo: I think it is >= IE 6 and <= IE 8. For OR it is |, so i guess & should work for AND. – Harry Aug 29 '13 at 15:50
  • 1
    Anyway, who cares about IE < 6? Just do `IE lte 8` – gustavohenke Aug 29 '13 at 15:51
  • @Harry - indeed, `gte` is "greater than **or** equal", just `gt` would be "greater than", can never remember this crap, as it's been years since I used it last. – adeneo Aug 29 '13 at 15:53
  • Found this [link](http://segfaultlabs.com/devlogs/not-only-internet-explorer-conditional-comments) and the condition seems fine. – Harry Aug 29 '13 at 15:54
  • Your syntax is fine based on this [resource](http://msdn.microsoft.com/en-us/library/ms537512(v=vs.85).aspx). I'd check the following limitations mentioned for `selectivizr` though http://selectivizr.com/#things – Suvi Vignarajah Aug 29 '13 at 15:57
  • You're sure the issue isn't elsewhere. IE8 has issues with empty elements etc. and you're elements doesn't look like they have any content, just a background image, and you're using display inline, floats etc. Lots of things that could cause issues in IE8 ? – adeneo Aug 29 '13 at 16:02
  • I'm guessing you got this fixed? I don't see a difference in IE8 as of now? – kelly johnson Sep 10 '13 at 05:29

1 Answers1

0

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!

Kriszta
  • 670
  • 1
  • 7
  • 22