How to stop Internet Explorer 6/7 displaying hover submenus

StackOverflow https://stackoverflow.com/questions/19368729

Question

here's my website www.colaistemhuire.org It works fine in every browser except in IE6/7 the hover on the menus wont stay visible when I move the mouse into the submenu.

Since each of the top level menu items links to a new page with the submenus anyway, is there a quick way I can get IE6/7 to ignore the mouse hover so that when someone viewing the site in those browsers hovers over the top level menu they dont see the drop down menus at all?

Alternatively is there a fix to make those submenus stay visible?

Thanks

Was it helpful?

Solution

IE6 and 7 combined are less then 1% of all users these days. Are you sure it is worth your time?

But anyway, I would do something like that:

<!--[if lte IE 7]>     <html class="oldIE"> <![endif]-->
<!--[if gt IE 7]><!--> <html>         <!--<![endif]-->


.oldIE li:hover ul {
   display: none;
}

OTHER TIPS

Yes, make a style only for IE, like Eugene suggested, just make it important.

.oldIE li:hover ul {display: none !important;}

You can make use of Conditional Comments

<head>
<title>Extra-Curricular - Col&#225;iste Mhuire Ballygar</title>
<link rel="shortcut icon" type="image/png" href="images/favicon.png"/>
<!--[if !(IE 6)]>   
<link rel="stylesheet" type="text/css" href="style.css" media="screen"/>
<![endif]-->
<!--[if IE 6]>  
<link rel="stylesheet" type="text/css" href="style_pacthed.css" media="screen"/>
<![endif]-->
</head>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top