Forcing browser compatibility in IE

I happened to stumble upon this concept long back and due to some reason which I don't remember, I lost interest in it. After a long time when I checked my archives, I came across this concept again and thought its time I put it to good use. I as most developers do, believe, IE is the browser that is a gift for the developers. Its so buggy that you can forget why your wife threw a stick at you the same morning :).

And to add to the recipe we have different versions of IE which again are different from each other in behavior. Or at least that what I believe as far as I have worked with it. Stories apart, I will come to the point,

I just found some one talking about how to force IE8 to work like IE7 when working with XPages.That article was exhaustive, and I have lost track of it. But I do have parts of it documented there and there for my understanding.

All you got to do is put the following code in beforeRenderResponse event: 

// first option uses compatibility mode, second option too but stronger

// X-UA-Compatible: IE=7

// X-UA-Compatible: IE=EmulateIE7

if (context.getUserAgent().isIE(8, 8)) {

  var exCon = facesContext.getExternalContext();

  var response = exCon.getResponse();

  response.setHeader("X-UA-Compatible", "IE=EmulateIE7");

}

Understanding Compatibility View

Before displaying a standards-mode Web page, Internet Explorer 8 checks to see if the domain name of the Web site appears in the Compatibility View List. If so, the site is displayed using Compatibility View. If not, and the page contains no other direction, Internet Explorer 8 displays the page in Internet Explorer 8 Standards mode.

When a standards-based Web page is displayed in Compatibility View, the following changes occur.

• Pages are displayed in IE7 mode rather than IE8 mode.

• In the user-agent string, the browser identifies itself as MSIE 7.0 instead of MSIE 8.0.

• Conditional comments and version vectors recognize the browser as Internet Explorer 7, rather than Internet Explorer 8.

These changes help ensure that users can still use Web sites that do not fully support the features of Internet Explorer 8.

Please note that the X-UA-COMPATIBLE header has greater precedence than Compatibility View. If a Web site is on the Compatibility View List and a page on that site includes an X-UA-COMPATIBLE header telling Internet Explorer 8 to display a page in IE8 mode, the page is displayed in Internet Explorer 8 Standards mode. This allows Web developers to support Internet Explorer 8 Standards mode on an incremental basis

Javascript to identify the compatibility mode

engine = null;

if (window.navigator.appName == "Microsoft Internet Explorer")

{

   // This is an IE browser. What mode is the engine in?

   if (document.documentMode) // IE8

      engine = document.documentMode;

   else // IE 5-7

   {

      engine = 5; // Assume quirks mode unless proven otherwise.

      if (document.compatMode)

      {

         if (document.compatMode == "CSS1Compat")

            engine = 7; // standards mode

      }

   }

   // The engine variable now contains the document compatibility mode.

}

To specify a document mode for your Web pages, use the META element to include an X-UA-Compatible http-eqiv

header in your Web page. The following example specifies EmulateIE7 mode compatibility.