IE10 Forced into IE7 Standards document mode for Visualforce

I’ve created a VF page which leverages some nice CSS 3 and HTML 5 features but it doesn’t render correctly on IE10. This is not because IE10 doesn’t stick to standards, but because it’s reverting to an IE7 document mode, and IE7 didn’t support the features I’m using.

Salesforce UI pages correctly use IE 10 Browser Mode and IE 10 Document mode, but ANYTHING that gets served up from a VF page falls back to the other mode. I’ve used the correct docType for HTML 5 and I’ve also used the following meta tag which should tell IE to use the latest mode:

<meta http-equiv="X-UA-Compatible" content="IE=10"/>

but even that doesn’t do the trick. I took the generated source and tried hosting it on my own server and IE uses the correct mode there, so it seems to be related to how the page is being served up. There is a compatibility list for IE which is a list of domains for which it should use an older mode, but I can’t find anything to do with force.com on there.

Has anybody encountered this and found a way around it? Short of putting everything inside a full page iFrame that’s hosted elsewhere haven’t found a way to get the styling correct.

Answer

I can’t recall if it solved the exact issue you are describing, but I had an IE version compatibility issue (I think affecting IE9) which was definitely solved by adding

Apexpages.currentPage().getHeaders().put('X-UA-Compatible', 'IE=8');

To the page initializer action and all other methods that returned PageReferences that could be null. You could try this with IE=8 and IE=10.

solution

With IE10 using the following in the controller constructor worked (didn’t in the init action for some reason):

Apexpages.currentPage().getHeaders().put('X-UA-Compatible', 'IE=10');

Attribution
Source : Link , Question Author : Matt Lacey , Answer Author : Matt Lacey

Leave a Comment