Problems with IE8 Standards Mode, SharePoint menus, and DocTypes

With the official release of Internet Explorer 8, many people are starting to test their custom SharePoint branding in the new browser. IE8 is an interesting animal in that it decides its rendering engine based on certain criteria in your code (in SharePoint’s case, the master page):

  • If IE8 sees a valid DocType declared it will attempt to render a site in IE8 Standards Mode.
  • If IE8 does not see a DocType it will attempt to render a site in quirks mode (otherwise known as pre IE7 rendering mode).

 

One nice thing about IE8 is that it includes Developer Tools (click Tools > Developer Tools) which will actually show you which rendering mode is currently being used (the last tab at the top of the Developer Tools window). You can also use this tab to test the other rendering modes, selecting them and observing the result in the refreshed window.

Now, on to the topic of SharePoint master pages. Some Microsoft out of the box master pages (like default.master and the horizon master pages) do not have a DocType declared and will render in quirks mode by default in IE8 (which is how they should be rendered because the master page html is coded that way). Some other Microsoft out of the box master pages (like BlueBand.master) DO have DocTypes declared. For these master pages (and for ones like default.master if you were to add a DocType to them,) IE8 will automatically attempt to render them in IE8 Standards Mode. This is bad because from all of my initial testing, the out of the box SharePoint menu’s can not show dynamic menu items (otherwise known as fly-outs) in IE8 Standards Mode. They appear as just white boxes without a link to click on.

To correct this problem the IE8 team has given us two meta tags:

The first will force a page to render in IE7 mode no matter what, and the second forces a page to render as IE7 would have rendered it historically. The difference being the EmulateIE7 meta tag will force the browser to look for a DocType before rendering in IE7 mode and if it does not find one it will render in Quirks Mode. This is the correct behavior for how IE7 used to render pages and I believe the correct one that should be added to all custom current version SharePoint  master pages.

So in closing, if your custom master page (or even your BlueBand based master page) is going to support IE8, you should seriously consider adding this meta tag:

Be sure to check-in a major version / publish and approve the master page after you add the tag. Also, you may have to restart your IE8 before the change will be picked up (mine cached the old version of the page and for a while I thought the meta tag wasn’t working).

Update 4:

There is a Hotfix though that should fix the problem:

http://support.microsoft.com/?id=962351

 

UPDATE 3: Many people have been keen to tell me that SharePoint SP2 supposedly fixes this problem. The only thing I can see being done in SP2 is that now all of the out of the box master pages have the above meta tag added. You are still left to your own devices for your custom master pages.

UPDATE 2: I should also point out that you can solve this problem at the web server level if you don’t want to modify your master page. Note: I prefer the master page method since it is more absolute, no chance for accidental changes (but I know some folks that can’t edit their master pages). There is information and links for doing this at the bottom of this link: http://blogs.msdn.com/ie/archive/2008/06/10/introducing-ie-emulateie7.aspx

UPDATE 1: Eric Lawrence (creator of the awesome Fiddler application) points out that intranet sites are rendered in IE8 by default in compatibility mode so the meta tag technically isn’t required in these environments. Note: according to IE team’s blog an intranet site is determined based on its local URL, not by IP address. So if users browse your intranet site via IP address or external URL they will see the site NOT in compatibility mode by default.