Question

Hey guys I set up this CSS file to use on the navbar:

#nav
{
    background-color: #98bf21;
    } 
#nav li
{
float:left;
}
#nav li ul{
    position: absolute;
    width: 172px;
    left: -999em;
    }

#nav li:hover ul{
    left: auto;
    }   
#nav a:link,a:visited
{
display:block;
width:164px;
font-weight:bold;
color:white;
background-color:#98bf21;
text-align:center;
padding:4px;
text-decoration:none;
text-transform:uppercase;
}
#nav a:hover,a:active
{
background-color: #7A991A;
}

And it seems to be affecting all the elements. For example all elements take the styles if the #nav a styles. Is there something I’m missing here? I’m new to web design.

Answer 1

#nav a:link,a:visited and #nav a:hover,a:active look like they could be the problem (the second selector is not bound to #nav in those lines and so will be matching all a elements. I’m assuming you mean to do #nav a:link, #nav a:visited and #nav a:hover, #nav a:active instead.