Browser Compatability

As we all know (and don't like it...) different browsers display HTML pages differently. We always work hard to make the pages we write to look good and the same in all browsers, or at least in the more popular ones. Some browsers that we will not mention their name (but they are made by microsoft) show HTML differently even between version. some not-very-sophisticated code works in one version and not in the other, especially new code is not backward competible.

There are two ways to tackle this situation. One is to write "lower denominator code", HTML code that all browsers and versions treat the same, and avoiding code that the browsers show differently. This leaves us with a pretty basic subset of HTML, but it can be done for simpler pages.

The second way is to write browser-specific code. something in the area of "If IE then do this, else if Firefox do that". this should be done only in cases where there is no unified solution that include all browsers.

In order to apply the second solution on the server side i suggest using these components and methods:

Create an Enum for all different supported browsers and version, something like that:

public enum Browsers
{
IE6,
IE7,
Firefox2,
Safari1
}

Create a function that recieves the BrowserCapabilities object included inside every HTTP request, and returns the specific browser and version as one of the Enum members:

public Enums.Browsers GetBrowser(HttpBrowserCapabilities browserCap)
{
string strBrowser = browserCap.Browser;
int majorVer = browserCap.MajorVersion;
return (Enums.Browsers)Enum.Parse(typeof(Enums.Browsers), strBrowser + majorVer.ToString());
}

Use this function to easily create switch cases to handle places that need different treatment for each browser: (In this case i use a negative margin to eliminate a blank area created in the original of a relatively-positioned Div element that includes an overlay image. This bug happends only in IE version 6)

switch (utils.GetBrowser(Request.Browser))
{
case Enums.Browsers.IE6:
divPlayImage.Style.Add("margin-bottom", (0- imgPlay.Height - 3).ToString() + "px");
break;
}

Happy coding,

Benny.