Internet Explorer 11 Disable "Display Intranet Sites in Compatibility View" via Meta Tag Not Working

Internet Explorer 11 disable display intranet sites in compatibility view via meta tag not working

Make sure:

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

is the first <meta> tag on your page, otherwise IE may not respect it.

Alternatively, the problem may be that IE is using Enterprise Mode for this website:

Your question mentioned that the console shows: HTML1122: Internet Explorer is running in Enterprise Mode emulating IE8.
If so you may need to disable enterprise mode (or like this) or turn it off for that website from the Tools menu in IE.
However Enterprise Mode should in theory be overridden by the X-UA-Compatible tag, but IE might have a bug...

How to disable Compatibility View in IE

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

should force your page to render in IE8 standards. The user may add the site to compatibility list but this tag will take precedence.

A quick way to check would be to load the page and type the following the address bar :

javascript:alert(navigator.userAgent)

If you see IE7 in the string, it is loading in compatibility mode, otherwise not.

Angular on IE 11 intranet - programmatically disable Compatibility View

I went back and looked closer at my index.html file. The only changes I made was that we had a duplicate meta tag that was commented out, and some extra spacing between our Edge meta tag's attributes and the /> at the end.

I erased all of these and now the app works regardless of the settings. I tried to play around with deleting some spaces but not others, or not deleting the commented code vs deleting it - the change from the app working to not working at that point seemed random and didn't really add up (server lag?) - so I couldn't pinpoint the cause. But I do know that once I removed all of the excess spacing and the commented out meta, it works - despite me thinking this wouldn't matter.

Made sure I cleared cache, etc before testing each time, and had my team mates try on their machine. I hope this solved the issue and it's not more random than that. If it breaks again, I'll update this thread, but for now its working. Thanks to all who commented.

Forcing IE's Compatibility Mode off

In my opinion, the issue is related that you site belongs to the Local Intranet Zone. When you access the site from the office's network, it will mapped to the Local Intranet Zone.

So, when you checked the "display intranet sites in compatibility view" options and access the site from office's network, the site will in the compatibility mode. You could try to uncheck this option to disable the Compatibility View / Mode. Also, you could try to disable Local Intranet Zone.

More details, please refer to The Intranet Zone and How to turn off compatibility View / Mode in Microsoft IE10 and IE11

React not rendering in IE compatibility view

From the official documentation, react doesn't support older browsers below IE 9. You say you run it in compatibility mode which is IE 5 and IE 7. React doesn't support these two IE versions.

You could add this meta tag manually <meta http-equiv="X-UA-Compatible" content="IE=edge"> in the <head> of public/index.html to override the compatibility view.

Besides, does your app work well in IE 11 without compatibility view? You could also follow this answer to make it supported on IE 11.

Internet Explorer 11 Disable "Display Intranet Sites in Compatibility View" via Meta Tag Not Working