When my submenu pops out the links are inheriting the style of my main page links, rather than the dhtmlgoodies_subMenu style. The hover and the dhtmlgoodies_menu works correctly. I can't figure this out. Here is my CCS...
a:link { color: #B7422B; text-decoration: underline }
a:active { color: #B7422B; text-decoration: underline }
a:visited { color: #B7422B; text-decoration: underline }
a:hover { color: #B7422B; text-decoration: none }
-
- [blah, blah]
-
#dhtmlgoodies_menu{
font-family:arial; /* Font for main menu items */
font-size: 12px;
width:150px; /* Width of main menu */
}
-
- [blah, blah]
-
.dhtmlgoodies_subMenu{
visibility:hidden;
position:absolute;
overflow:hidden;
border:1px solid #9F97B1;
background-color:#3C3155;
font-family:arial;
font-size: 12px;
font-weight: bold;
text-align:left;
}
.dhtmlgoodies_subMenu ul{
margin:0px;
padding:0px;
}
.dhtmlgoodies_subMenu ul li{
list-style-type:none;
margin:0px;
padding:5px; /* 3px of air between submenu border and sub menu item - (the "white" space you see on mouse over )*/
}
.dhtmlgoodies_subMenu ul li a{ /* Sub menu items */
white-space:nowrap; /* No line break */
text-decoration:none; /* No underline */
color:#9F97B1; /* Black text color */
height:16px; /* 16 pixels height */
line-height:16px; /* 16 pixels height */
padding:2px; /* 1px of "air" inside */
display:block; /* Display as block - you shouldn't change this */
}
.dhtmlgoodies_subMenu ul li a:hover{ /* Sub menu items - mouse over effects */
color:#FFFFFF; /* White text */
background-color:#317082; /* Blue background */
}