[SOLVED] A:link color problems

[neoform]

<style>
.class1, class1 a { color: blue; }
.class2, class2 a { color: green; }
</style>

<div class="class1">
   <a href="moo.html">This link shows up as blue</a>
   <a href="moo2.html" class="class2">This link shows up as blue even though it should be green.</a>
</div>

 

Anyone know how to get around this without resorting to applying classes to every <a> tag.. ? Like say I want to change the color of a single link while leaving default to all the others..

[wildteen88]

blue and green for me using IE7.0, Opera9.10 and FF2.0 on windows.

[neoform]

wow, you're right..... somehow my test example works but not my code..  wtf 

[neoform]

ok, just noticed there was a bug in the css, but the color problem is there now.

 

<style>
.class1, .class1 a { color: blue; } /* forgot to put the dot in front of the second class name */
.class2, .class2 a { color: green; }
</style>

<div class="class1">
   <a href="moo.html">This link shows up as blue</a>
   <a href="moo2.html" class="class2">This link shows up as blue even though it should be green.</a>
</div>

 

any ideas?

[wildteen88]

This is the correct CSS:

.class1 a{ color: blue; }
.class1 a.class2 { color: green; }
</style>

<div class="class1">
   <a href="moo.html">This link shows up as blue</a>
   <a href="moo2.html" class="class2">This link shows up as blue even though it should be green.</a>
</div>

[neoform]

there's no way to trim that down at all?

 

I'm planning on using class2 as a way to highlight links inside of every other class on the page.. :S

[wildteen88]

You can change the CSS to this:

/* all anchors in the document will have a defualt colour of blue */
a { color: blue; }
/* all anchors with the class of 'class2' a green colour - this will override the default colour */
a.class2 { color: green; }

[neoform]

cool, thanks