Hey everyone, I have made a pure CSS drop down menu for school. I wrote everything by hand. My website works great in Safari, Firefox, and Google Chrome but when a bring it to school to be marked, the drop down menu does not work with Internet Explorer. This is because IE does not support the hover tags. Is there any script or alternative things that I can put in the CSS or HTML document to make it work the same in IE as Safari or Firefox?
So I need a script that will make the hover tag work in IE, or any alternative tags I can use so that browser like IE will read my CSS menu right.
Here is the CSS file:
Any tips would be greatly appreciated.
So I need a script that will make the hover tag work in IE, or any alternative tags I can use so that browser like IE will read my CSS menu right.
Here is the CSS file:
Code:
#wrapper {
width:940px;
margin-left:auto;
margin-right:auto;
}
@charset "utf-8";
#navMenu {
margin:0;
padding:0;
}
#navMenu ul {
margin:0;
padding:0;
line-height:30px;
}
#navMenu li {
margin:0;
padding:0;
list-style:none;
float:left;
position:relative;
background:#999;
}
#navMenu ul li a {
text-align:center;
font-family:"arial", cursive;
text-decoration:none;
height:30px;
width:150px;
display:block;
color:#FFF;
border: 1px solid #000;
text-shadow:1px 1px 1px #000;
}
#navMenu ul ul {
position:absolute;
visibility:hidden;
top:32px;
}
#navMenu ul li:hover ul {
visibility:visible;
}
/***********************************************/
#navMenu li:hover {
background:#09F;
}
#navMenu ul li:hover ul li a:hover {
background:#CCC;
color:#000;
}
#navMenu a:hover {
color:#000;
}
.clearFloat {
clear:both;
margin:0;
padding:0;
}
Any tips would be greatly appreciated.
Last edited by a moderator: