Today i tried installing the Google Chrome in my laptop machine. Although it is light and nice in look and rich in features (as usual from Google), it showed some weired behaviour when i open my online applications. Especially the ASP.Net Menu Control was not rendered as is to be.
It does not display the child nodes on hover and when we click any menu item, it then refresh the page with child nodes...
Cause & Resolution
The reason for this weird behaviour is just because the way the menus are rendered in chrome is different from IE and Fire Fox (FF). The recent chrome browser render the <a> component as <div> and <span> . If you look into the view source, you may notice that the menu structure as below.
<span><a class="ctl00_mainMenu_1" href="Test1.aspx">Menu1</a></span>
<span><a class="ctl00_mainMenu_1" href="Test2.aspx">Menu2</a></span>
<span><a class="ctl00_mainMenu_1" href="Test3.aspx">Mwnu3</a></span>
It is because of both Internet Explorer and Firefox render the ASP.NET Menu control as <table>--<a> mark up.
However, the rendered mark up for the latest beta version of Google Chrome will be like the following code, the <table> and <a> become to <div> and <span> :
And the best resolution for the subject issue is to ASP.NET 2.0 CSS Friendly Control Adapters 1.0. This adapter will render the ASP.NET Menu in Google Chrome properly