by Marie
18. June 2010 04:18
If you have been using the asp.net menu control as an alternative to css menu in you web sites, you may have noticed problems in the display of navigation item in Internet Explorer 8. The sub menu navigation appears as a white box and the user of the website is unable to click on an item.
The Problem is (element).currenttyle.zindex returns “auto” in standards mode when z-index has not been set in your style sheet. Good news is that there is a solution to the problem. You have three different options to try, which will be discussed below.
- Overriding the z-index property
Add to the <Dynamic Menu Style CssClass=”IE8Fix” />
Add to the master page or each individual page if a master page does not exist the following code.
<style type=”text/css”>
.IE8Fix{z-index:100;
</style>
- Using CSS Friendly Control Adapters
Download CSSFriendly.dll + CSSFriendlyAdapters.browser
Inside you project add a reference to cssFriendly.dll
Add the special folder App_Browsers to your project, and copy the file CSSFriendlyAdapters.browser. The CSS Friendly Control Adapters will render all the listed controls (menu, treeview, DetailView,…) using CSS and HTML standards.
- Adding the IE7 meta tag to the website
By Default, IE8 will attempt to display content using its most standards-compliant mode, IE8 Standards Mode. However, you can switch to the IE7 Standards mode by adding a particular meta tag to the head of the page:
<head>
<meta http-equiv=”X-UA-Compatible” content=”IE=EmulateIE7” />
</head>
Using this tag, the website in IE8 will look and work in the same way as it does in IE7.
Which approach you take is up to you and the how your site is configured. For me, modifying the z-index solved the problem.
Subscribe