[Prole]

wondering if anyone could help me on this...
i've seen it done before but can't remember where.

i am using CSS for the links on a corporate site. at the top, the links are white and goto yellow when rolled over.
this is the code:

A:Link {text-decoration: none; color: #ffffff; }
A:Hover {text-decoration: none; color: #ffcc33; }
A:Visited {text-decoration: none; color: #ffffff; }
A:Active {text-decoration: none; color: #ffffff; }

now, the problem is that elsewhere in the site, if i use white for the links they won't be seen, so i'd like them to be another colour elsewhere?
how would i do this tho??
any help would be much appreciated.
cheers!

[dorian]

Prole,
What you need is [i:88e5552500]CASCADING STYLESHEETS[/i:88e5552500]...

a:Link {text-decoration: none; color: #ffffff; }
a:Hover {text-decoration: none; color: #ffcc33; }
a:Visited {text-decoration: none; color: #ffffff; }
a:Active {text-decoration: none; color: #ffffff; }

a.LinkOnWhite:Link {text-decoration: none; color: #990000; }
a.LinkOnWhite:Hover {text-decoration: none; color: #FF0000; }
a.LinkOnWhite:Visited {text-decoration: none; color: #666666; }
a.LinkOnWhite:Active {text-decoration: none; color: #FF0000; }

I know sh*t about coding, but I also know what I know...

[vickygale]

You should be able to do what you want by using the class attribute on the links you wish to be a different colour e.g.

For the links at the top of the page:

.top a:link {text-decoration:none; color:#FFFFFF;}
.top a:hover {text-decoration:none; color:#FFCC33;}
.top a:visited {text-decoration:none; color:#FFFFFF;}
.top a:active {text-decoration:none; color:#FFFFFF;}

For the links on the rest of the site:

a:link {text-decoration:none; color:#FF0000;}
a:hover {text-decoration:none; color:#FFCC33;}
a:visited {text-decoration:none; color:#FF0000;}
a:active {text-decoration:none; color:#FF0000;}

In the html:

<a href="..." class="top">...</a> for the links at the top of the page
<a href="...">...</a> for the links on the rest of the site.

[Prole]

cheers for the help mate but i couldn't get it to work
could you perhaps just show me a really quick example?

[jk]

Cheers for that, I also needed that

[Prole]

ahh, got it all working now!
thanks dorian, thanks vicky

[vickygale]

You're welcome. Glad to be of help.

[Bill Posters]

[quote:c295cb9579="vickygale"]For the links at the top of the page:

.top a:link {text-decoration:none; color:#FFFFFF;}
.top a:hover {text-decoration:none; color:#FFCC33;}
.top a:visited {text-decoration:none; color:#FFFFFF;}
.top a:active {text-decoration:none; color:#FFFFFF;}


In the html:

<a href="..." class="top">...</a> for the links at the top of the page
[/quote:c295cb9579]

That example is not being used as it could/should.

In the HTML:
[code:1:c295cb9579]
<div class="top">
<a href="...">Link1</a> <a href="...">Link2</a> <a href="...">Link3</a>
</div>
[/code:1:c295cb9579]

Using the css in your example (quoted) you only need to add the "top" class name to the container element (div, td, h, span, ...), not every link.
Every link that falls inside an element with that class will be styled according to the [i:c295cb9579].top a:link {...} ...[/i:c295cb9579] declaration block.


You only need to add the class name to every link tag when using the other pseudo-class style you showed:

[code:1:c295cb9579]
a.top:link { ...}
[/code:1:c295cb9579]

...goes with:
[code:1:c295cb9579]
<a href="…" class="top">Link1</a><br />
<a href="…" class="top">Link2</a><br />
...
[/code:1:c295cb9579]

[Bill Posters]

WTF?!

Clearly someone else here needs help.

[sleepingfish]

An email to the right person at

http://www.sciborg.uwaterloo.ca/

wouldn't go amiss