Building responsive website in IE8

I know that media queries are not supported in IE and below, so I am keen to understand how <IE9 browsers treat them? Do they just ignore any styling withing a media query and use the base styles? My aim is to build mobile up so does that mean that IE8 would use the mobile style?

Also what are my options for getting around this? I have read a little on respond.js or is it better to use a specific IE CSS instead or like the 320 and up framework it appends a class to the html tag when being viewed in <IE9 so that over-writing styles can be used but this will bloat the CSS will it not?

Any advice would be great.

Who is Participating?
RobConnect With a Mentor Owner (Aidellio)Commented:
I'm split on the use of respond.js.  How long are you planning to support them for?  There are quite a few issues with using the script that you would have to be happy with such as IE locking up if the fonts don't load properly, cross domain ajax requests to get your css and the screen flashing as the script runs and applies the styles to the page, to name a few.
Remember the script will run on all devices, not just IE8

When you no longer support IE8, what will be easier to manage, the removal of respond.js or the IE8 stylesheet?

I'm thinking about your target audience and what this site is all about.  What is the content you're delivering?  If you're looking for that wow factor then I would be pushing for the latest and greatest technologies. shows how little IE and IE8 are used now, can your "people above" not be convinced to move to a later version of IE or at least another browser such as Firefox or Chrome?  Market it the "Apple way" that to have our product you need this product.  

I understand the need to have older versions of IE for internal apps that haven't been upgraded yet but for a web site for our product, I would want it cutting edge and that means using the latest versions of the browers.
Julian HansenCommented:
Also what are my options for getting around this?
Don't support IE8 - seriously - unless your client is chained to it don't support it.

There is no reason IE8 should continue to go on living - it is a thorn in the side of web dev and needs to go the way of IE6.

Rather spend your time on HTML5 and build a great 21st centuary site.
RobOwner (Aidellio)Commented:
+1 for what JulianH has said... Don't support it if you don't need to.

I would like to know WHY you want to support IE8.  Where did this come from?
Easily Design & Build Your Next Website

Squarespace’s all-in-one platform gives you everything you need to express yourself creatively online, whether it is with a domain, website, or online store. Get started with your free trial today, and when ready, take 10% off your first purchase with offer code 'EXPERTS'.

Al4ddin2Author Commented:
Stats. We still have enough users on IE8 to warrant the people above wanting to support it. Plus a lot of people at the company use it.
RobOwner (Aidellio)Commented:
Fair comment so sounds like your hands are tied for the moment.

As for the media queries, they are just ignored by < IE9.  The accepted way around this is to use IE's conditional commenting:

<link rel="stylsheet" type="text/css" media="all" href="style.css"/>
<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" media="all" href="style-ie.css"/>

Open in new window

Julian HansenCommented:
[NFP - not for points]
Just to clarify
unless your client is chained to it don't support it.
Seems like you are in the unfortunate position of having to develop for it.

Tagit has you on the right track but consider mentioning to your client that supporting IE8 is expensive in terms of time and they should consider upgrading.
Al4ddin2Author Commented:
What about respond.js?

Surely that would be easier that maintaining two stylesheets? no?

Just because you have to support IE8 does not mean you have to support it on devices IT DOES NOT SUPPORT.

Do an IE8 stylesheet and leave it at that any effort to enhance the IE8 experience on non-supported devices is going to be as productive as using a tennis racket with no strings.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.