IE8 is out. What does it mean for your theme?

If you're as cutting edge as our own Jonathan Neal, you might have downloaded the IE8 final that was released this morning at 9am PST.

IE8 is a HUGE improvement towards standards, and while it still has not caught up with Firefox, Safari, Chrome or Opera, when it comes to IE, we will take what we can get :)

However, since it's more accurate with the standards, you may have noticed that your theme could be off in IE8 compared to IE7.
If this is the case, there's a good chance that any IE hacks that existed in your theme to fix problems that were in IE7 and below. A good example of this would be using the .ie selector in your CSS.

The problem with applying a hack to ALL IE's via .ie means that when future versions, such as IE8 fix the problems you were hacking, these will break your theme for the new IE.

So what's the fix? It turns out there are 2 good fixes, one for the short term and one for the long term.

The long term fix is to of course change your selectors from being broad to being specific.
For instance, if you are using a selector like this:
.ie #wrapper {
}

And that selector is causing issues, you should change it to be:

.ie7 #wrapper, .ie6 #wrapper {
}

This will make sure that the selector only applies to specific versions of IE that have the broken functionality you're addressing.

But this might take some time to get around to, and we all are a bit busy, so there is a quick short term fix that will solve the issues.

In the <head> of your theme, you can add this:
<meta http-equiv="X-UA-Compatible" content="IE=7" />

That is a new tag Microsoft has added to IE8 so that you can tell IE8 what rendering engine to use. In this case we're telling it to use the IE7 rendering engine instead of the more standards compliant IE8 engine.

Blogs