a:hover problem

how do I keep a:hover links area on a page form affecting all links?

[vndgraphics]

I am re-designing a site and am trying to keep my a:hover text rollover links isolated to one area on my page without affecting all links on the same page. The link below will take you to the original where the isolated link thing works. However when I replace the areas around the shopping cart table with my graphics...the links inside the shopping cart table are affected (when you drag the mouse over them they change...I want them static like the original). the only difference I can find is that in the original style sheet all 4 "active,link,visited, and hover" are used. When I try creating all 4 for my text I get nothing. Only the hover by itself will work. From the link below if you click on the contact link upper right you can view my work.I am able to get my graphics to wrap around the shopping cart area perfectly and all my rollovers etc. work, Im just having a hard time keeping the the text rollovers only in the places I need them to be. If anyone has the answer please enlighten me <snip>
Thanks Scott
<snip>

[edited by: DrDoc at 2:42 pm (utc) on June 9, 2004]
[edit reason] Removed specifics [/edit]

[limbo]

Hi Scott

Welcome to Webmasterworld :)

This could be solved by using classes and wrapping links in a corresponding div. That way you can control your anchor properties as separate entities.

Also you may have your anchor properties out of order.

they must fall like this:

Link
Visited
Hover
Active

So the values do not counteract one another.

Ta

Limbo

[shaneshep]

Scott,

If I understand what you're asking correctly, you would like two different styles for your links on the same page. This can be done by creating a class like this on your style sheet:

a:link {
color: #666;
}
a:visited {
color: #666;
}
a:hover {
color: #999;
}
a:active {
color: #cccccc;
}
a.otherlink:link {
color: #fff;
}
a.otherlink:visited {
color: #fff;
}
a.otherlink:hover {
color: #666;
}
a.otherlink:active {
color: #999;
}

all normal links will use the first style, links that you want to use the second style would be called like this:
<a class="otherlink" href="path/to/link">Link Name</a>

I hope this helps!
_________________________
Shane