css: link color in UL class does not override default color for div

I have defined a div with the following:

#main-alt-2 a:link {color:#39c;}
#main-alt-2 a:visited {color:#39c;}

For a UL within this div I have defined this:

ul.menu a:link {
font-weight开发者_高级运维:bold;
display:block;
text-decoration:none;   
color:#323232;
}

All other properties within the ul.menu class work - except the color. Very strange!

Hope someone can help!

If multiple CSS definitions pertain to the same HTML element, the specificity of the selectors is compared. To make rules with lower specificity take precedence, add !important:

ul.menu a:link {color: #323232 !important;}

Alternatively, you can make the second selector more specific.

Because of css specificity, you will need to do it this way:

#main-alt-2 ul.menu a:link {
font-weight:bold;
display:block;
text-decoration:none;   
color:#323232;
}

#main-alt-2 a:link, since it includes an id selector, is more specific than ul.menu a:link

Make your selector more specific.