HTML: how to set link colors only for specific class

Question

I just saw this question Don't change link color when a link is clicked and now I'm stuck.

I have multiple links on my page, some of them with class="menuLink". Now only for those I want to set the colors different as a normal link. If I would just use

a:link { color:green}
a:hover { color:red }
...

this would apply to all links. But neither

.menuLink:link {color:green} 
//I think because the css "doesn't know" that this class is used for links

nor

.menuLink a:link {color:green}

work. How can I achieve this?

Answer 1

You were close.

a.menuLink:link { color: green; }

Was what you intended to achieve. But try this:

a.menuLink { color: green; }

Would mean a a with a classname of menuLink, the :link is redundant.

---

.menuLink a:link

Would mean a inside of an element with a classname of menuLink.

Answer 2

Have you tried:

   .menuLink {color: green;}