i have written css tab menu
but my links in submenu inherit the style of a href in main menu (#menu ul li a)?
when i hover over the links in submenu they do change as i want them to change they just display as #menu ul li a
what should i change?
thank you
but my links in submenu inherit the style of a href in main menu (#menu ul li a)?
when i hover over the links in submenu they do change as i want them to change they just display as #menu ul li a
Code:
#menu {
position:absolute;
height:auto;
width:930px;
top:10px;
left:10px;
}
#menu ul {
float:left;
margin:0;
padding:0;
list-style:none;
}
#menu ul li{
display:inline;
}
#menu ul li a{
width:80px;
height:22px;
float:left;
display:block;
margin:0 1px 0 0;
font-size:100%;
text-decoration:none;
text-align:center;
color:#FFF;
font-weight:bold;
background:url(../images/top_menu_normal.gif) left top no-repeat;
padding:3px 0 0 0;}
#menu ul li a:hover{
width:80px;
height:22px;
float:left;
display:block;
text-align:center;
margin-top:0;
margin-right:1px;
margin-bottom:0;
margin-left:0;
font-size:100%;
text-decoration:none;
color:#FFF;
font-weight:bold;
background:url(../images/top_menu_hover.gif) left top no-repeat;
padding:3px 0 0 0;
}
#menu ul li a:active{
width:80px;
height:22px;
float:left;
display:block;
text-align:center;
margin-top:0;
margin-right:1px;
margin-bottom:0;
margin-left:0;
font-size:100%;
text-decoration:none;
color:#FFF;
font-weight:bold;
background:url(../images/top_menu_hover.gif) left top no-repeat;
padding:3px 0 0 0;
}
#menu ul #submenu{
position:absolute;
top:2px;
left:0px;
float:left;
width:818px;
height:10px;
margin:0;
padding:0;
font-size:100%;
}
#menu ul #submenu ul {
position:relative;
margin:0;
padding:0;
bottom:-1.4em;
left:0px;
font-size:100%;
width:818px;
background:none;
}
#menu ul #submenu li{
display:inline;
list-style:none;
border-right:1px solid #CCC;
padding-right:2px;
background:none;
}
#menu ul#submenu li a{
text-decoration:none;
color:#000;
background:none;
}
#menu ul #submenu li a:hover{
text-decoration:none;
color:#CCC;
background:none;
}
#menu ul #submenu li a:active{
text-decoration:none;
color:#CCC;
background:none;
}
thank you
Comment