Use this convenient snippet in almost any project. It will fill in some basic support for modern CSS features for legacy IE versions.

<!--[if lt IE 9]>
<script src='//cdnjs.cloudflare.com/ajax/libs/nwmatcher/1.2.5/nwmatcher.min.js'></script>
<script src='//cdnjs.cloudflare.com/ajax/libs/json2/20140204/json2.min.js'></script>
<script src='//cdn.rawgit.com/gisu/selectivizr/1.0.3/selectivizr.js'></script>
<script src='//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.2/html5shiv.min.js'></script>
<script src='//cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.js'></script>
<![endif]-->


What’s going on?

The world has largely moved on from IE6 to IE8, but this is the least you can do to make your sites at least don’t appear broken on older browsers. This snippet packs these 5 libraries which can be dropped into any project:

  • html5shiv — for new HTML5 tags like <article> (IE6-8)
  • respond — for @media queries for responsive design (IE6-8)
  • selectivizr — for all modern CSS selectors (IE6-8)
  • json2 — for JSON parsing (IE6-7)
  • nwmatcher — the selector engine for selectivizr

It’s wrapped in an IE conditional comment, so only the poor souls with outdated IE’s will bear the extra load.

Selectivizr

While Selectivizr has been abandoned at 1.0.2, there are new changes that haven’t been officially released yet (see #67) that fixes interoperability with Respond.js. This article has the technical details, but is outdated in a few ways: Respond.js already has support for selectivizr in upstream, and the selectivizr changes described are already sitting unreleased in the master branch.

This snippet uses rawgit.com to fetch the unreleased 1.0.3 from the fork gisu/selectivizr to fix interoperability issues with respond.js.

Legacy IE cheatsheet

I’ve put together a Legacy IE cheatsheet to help you figure out what features you can use for older versions of IE.