Making Media Queries (responsive design) work in IE

Unfortunately there are still a lot of people browsing the web on Internet Explorer 8 and lower, this means all of these people cannot make use of responsive design since IE8 and lower doesn’t support media queries.

This as you can imagine caused a lot of problems, you can just use another stylesheet if someone browsing using IE comes to your site, but that’s quite simply a pain in the ass. Luckily for us a solution has been born in the form of JavaScript, you can find it on github here.

All of the usage instructions can  be found on the github page, but I want to tell you how easy it is, so follow my instructions instead:

  1. Download the respond.min.js file.
  2. Upload the respond.min.js file onto your web server
  3. Reference the JavaScript file in your header, ideally just below your CSS (but not above).

That’s it, just write your responsive CSS as normal.

It is important to say, that although this has worked perfectly for me on another site, it does only support min-width and max-width media queries and all media types (screen, print, etc), this is to save on file size and page speed.