Problem solved, I added the following styles to the wrong part of the style sheet.
Quote:
color: #FFFFFF;
background: none;
|
That's all it took to do.
Now im left with one last problem. On some browsers my drop down appears half way down the image and on others it appears perfectly (IE looks perfect, surprisingly
) I would like the menu to appear underneath the menu button like it does in IE not halfway down the button like it does in FF.
I have tried adding a value to top: 0; with no luck. Anyway here is my style sheet for the menu.
Code:
.anylinkmenu{
position: absolute;
left: 0;
top: 0;
visibility: hidden;
border: 1px solid black;
border-bottom-width: 0;
font: normal 12px Verdana;
line-height: 18px;
z-index: 100;
background: #78C9F9;
width: 200px;
}
.anylinkmenu ul{
margin: 0;
padding: 0;
list-style-type: none;
}
.anylinkmenu ul li a{
width: 100%;
display: block;
text-indent: 3px;
border-bottom: 1px solid black;
padding: 2px 0;
text-decoration: none;
font-weight: bold;
text-indent: 5px;
color: #000000;
background: none;
}
.anylinkmenu a:hover{ /*hover background color*/
background: #16191B;
color: #FFFFFF;
}
.anylinkmenucols{
position: absolute;
width: 350px;
left: 0;
top: 0;
visibility: hidden;
border: 1px solid black;
padding: 10px;
font: normal 12px Verdana;
z-index: 100;
background: #E9E9E9;
}
.anylinkmenucols li{
padding-bottom: 3px;
}
.anylinkmenucols .column{
float: left;
padding: 3px 8px;
margin-right: 5px;
background: #E0E0E0;
}
.anylinkmenucols .column ul{
margin: 0;
padding: 0;
list-style-type: none;
}
Thanks for any help! I can't wait, so excited!
Jack