Thursday, October 13, 2011

Specifying Document Compatibility Modes for ASP.NET Intranet Sites using IE8

I noticed some oddities on the way an ASP.NET website I was working with was rendering on the intranet, but not through the Cassini development server in VS.NET 2010. This of course makes sense because the development server does not parse and render identical to IIS, but it was still puzzling.

After a bit of research I found that the following setting in Internet Explorer 8: Tools -> Compatibility View Settings -> ‘Display intranet sites in Compatibility View' was checked by default. This ends up having your site render in IE7 mode and was the cause of the odd rendering in my case (i.e. entire dropdowns scrolling along with the screen, HTML header tags not sizing properly, etc.).

The initial thought is just to deselect the option and allow the browser to work in IE8 standards mode. However since we are discussing 'intranet' applications, this problem would persist to all clients of the application unless a mass update was pushed out via group policy which is unlikely.

The easiest fix is to set the document compatibility mode for the site in the Master Page(s) or main page of the site to the browser standard you wish to use. The post is almost outdated as soon as it was published because it is speaking about a browser that is 2.5 years old, but as many enterprises are still on IE8 because of Windows XP, this unintended switch may not be favorable to the developer. All that must be done is add the following meta tag in the header of the webpage (the HEAD section) before all other elements except for the title element and other meta elements:
<!-- Enable IE8 Standards mode -->
<meta http-equiv="X-UA-Compatible" content="IE=8" />
After updating the site on the IIS server and bringing it back up in IE8, you will notice your site render properly even with the default IE8 settings to display 'intranet' sites in ‘Compatibility View’. This topic is actually much more involved than the specific piece of advice covered here, so look to the following if you need any further information.

Defining Document Compatibility

1 comment:

  1. This code snippet also fixes some weird issue with Asp.Net menu control functioning under IE8/IE9.

    ReplyDelete