basic anchor tags in CSS

[pelicanPaul]

1) Script Title: Chrome CSS Drop Down Menu (v2.01)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/chrome/index.htm

3) Describe problem:

I am using the chrome menu and all is well..

however when my CSS has basic anchor tags in it, these overwrite the STYLES for the chrome menu CSS anchor tags... has anyone run into this?

Paul

/* Basic ANCHOR Tags */

A {
FONT-FAMILY: Verdana, Arial, sans-serif;
FONT-SIZE: 8pt;
COLOR: #709E48;
FONT-WEIGHT: 200;
text-decoration: underline;
}
A:visited {
FONT-FAMILY: Verdana, Arial, sans-serif;
FONT-SIZE: 8pt;
COLOR: #709E48;
FONT-WEIGHT: 200;
text-decoration: underline;
}
A:hover {
FONT-FAMILY: Verdana, Arial, sans-serif;
FONT-SIZE: 8pt;
COLOR: #709E48;
FONT-WEIGHT: 200;
text-decoration: none;
}

will then be apllied to
the

.chromestyle ul li a{
color: #494949;
padding: 4px 7px;
margin: 0;
text-decoration: none;
border-right: 1px solid #fff;
}

weird???

[jscheuer1]

Generally, this sort of thing is more likely to happen in IE for some reason but, depending upon how the styles cascade, any browser might show some bleed over. To correct this, you must define the pseudo classes* for the:

.chromestyle ul li a

selector as well, paying particular attention to any places where your desired style for them deviates from a declared style for the generic anchors.

Also, where the basic generic anchor definitions deviate from what the basic .chromestyle ul li a definitions would be if there were no generic declarations, the basic .chromestyle ul li a definitions will need to be specifically spelled out if there is bleed over from the basic generic anchor definitions.



*:visited and :hover in this case but, any that you may decide to declare at some other time as well.