ASP.NET Menu Controls in Google Chrome

As is the case most of the time, I’m posting now to tell you about a problem I’ve just fixed.

The Problem

My asp.NET Menu Control was rendering perfectly in IE 7, but looked completely horrid in Chrome. My submenus also weren’t displaying on mouseover.

My code was fine because the menu did work perfectly in IE 7. The problem must, therefore, be with the browser.
Based on what I’ve found online researching this problem, it seems that ASP.NET renders controls in a specific way to allow for backward compatibility with older browsers. As it turns out, ASP.NET doesn’t have a “definition” for Google Chrome that tells it what the browser’s capabilities are. The end result being that the server renders the control incorrectly because ASP.NET doesn’t know what Chrome can do.

The Solution

Given the explanation above, the solution seems obvious: Tell ASP.NET what Chrome can do.
To do this, you can follow these steps:

  1. Add the App_Browsers folder to your website
  2. Create a new Browsers file in this folder and call it Chrome.browser
  3. Comment out everything in the file and replace it with this:
1 <browsers>
2 <browser refID=safari1plus>
3 <controlAdapters>
4 <adapter controlType=System.Web.UI.WebControls.Menu adapterType=“” />
5 </controlAdapters>
6 </browser>
7 </browsers>

All this basically does (as far as I can logically understand) is tell the server that Chrome can handle the Menu Control’s full functionality.

Happy Coding!

/Logan

Advertisements

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s