ASP.NET Menu rendering issue in Google Chrome

Now, that was weird!

Surprisingly, I jumped into a rendering issue with ASP.NET menu in Google Chrome and I observed following glitches:

1. Sub-menu items were not displaying on hovering over the main menu (say Products)
2. When I select the main menu item (Product), the respective sub-menu items are displayed horizontally, instead of listing vertically (on hover)

Here goes a sample screenshot

The solution is to check for Chrome user-agent string and clear the browser adapter mapping so that the control will be rendered irrespective of the client browser.

if (Request.UserAgent.IndexOf("Chrome") > 0)

{

    if (Request.Browser.Adapters.Count > 0)

    {

        Request.Browser.Adapters.Clear();

        Response.Redirect(Page.Request.Url.AbsoluteUri);

    }

}

The ControlAdapter provides a mapping between an ASP.NET Web Control and the adapter used to render the control in client browser.

If you are interested to dig deeper, then have a look at here and here.

Best way to use this code is to create a Base class inherited from System.Web.UI.Page and include this code in appropriate page event. Now, you can inherit this base class is those pages that require this piece of code.

Note: After clearing the Adapter for Chrome, I haven’t experienced any issues with other web controls so far. In case, if you are facing any issue, please feel free to share it.

Thanks

Back, Back, Back

Hoooo!!! How frustrating it was. I’s on to tight work schedule. Didn’t got any free time to be with my pet projects nor with my blog . It’s really frustrating and suffocating, if you know what I mean!

Now, I’m pretty free from my tight schedule and will get enough time to blog as well (finger’s crossed). Got a lot of things to update and lot of exciting things to share!

Keep watching! I’ so excited and thrilled. Because, I can enjoy the free-DOM.

Thanks!