Recently I was testing out browser compatibility on a WordPress theme which I’m building. Since I do my development on a Mac, I was running Windows in a virtual machine. I have a web server installed locally on my Mac, which I can access from my windows VM. The problem was that Internet Explorer 9 kept insisting on rendering the site in IE7 compatibility view mode. I could use IE9’s developer tools to switch the rendering mode back to IE9, but whenever I would close the browser and reopen it, the page would be in rendered in IE7 mode again. And I’m using a valid HTML5 doctype, so I knew that wasn’t the cause of the problem.
It turns out, that when the page is retrieved from a local server, Internet Explorer will use its intranet settings, which default to rendering the page in IE7 mode. <sarcasm>Apparently the IE7 rendering engine is so good that it should be the default for viewing all intranet sites, even if we have IE8 and IE9 mode available.</sarcasm>
After digging around a bit, I found an innocent-looking little checkbox in IE9’s Compatibility View Settings dialog box (Tools->Compatibility View Settings), called “Display intranet sites in Compatibility View”. I just turned that off, and IE9 started behaving itself like an adult.
Hopefully this tip can helpful to other developers who can’t figure out why the site they’re developing locally looks horrible in IE9.