Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS CSS Basics (2014) Basic Selectors Pseudo-Classes

Posted by Austin Barnes
Austin Barnes
8,142 Points

Why do all links on a page change colors when i just click on specific link?

I have setup a:link, and a:visited correctly, and the colors correspond correctly. However, whenever I click on a link that was in an unvisited state, it causes ALL of the other links (that have not been clicked) to change into the a:visited state..

It should only change the one specific link that I clicked into a 'visited' state. is there any way to define this?

Tarran Prior
Tarran Prior
Courses Plus Student 3,169 Points
Tarran Prior
Tarran Prior
Courses Plus Student 3,169 Points

Hello Austin.

Are all of the links you're using pointing to different pages? Or are they all pointing to the same link (such as '<a href="#">'?)

3 Answers

saber
saber
13,276 Points
saber
saber
13,276 Points

Ah I see. I had this problem too. At some point it looks like Guil went through and gave all the hrefs different links like #more, #wildlife, etc so this wouldn't happen but didn't tell us. I'm following along in my own text editor instead of using workspaces so I didn't get that update.

Jay Dacosta
Jay Dacosta
5,913 Points
Jay Dacosta
Jay Dacosta
5,913 Points

All the links change back to blue after clicking because you have all the links set to the same target ( href="#" ). You should notice that all the links except the "Back to top>>" one at the bottom have changed. That's because we gave that bottom link a specific target.

Essentially, the browser thinks you have already visited all those links with the target of "#". if you change the href/url/file-path you'll notice that those items will change back to orange until you click them again. Hope that helped

John Kennedy
seal-mask
.a{fill-rule:evenodd;}techdegree
John Kennedy
Front End Web Development Techdegree Student 9,663 Points
John Kennedy
.a{fill-rule:evenodd;}techdegree
John Kennedy
Front End Web Development Techdegree Student 9,663 Points

What type of selector are you using? Can you post a snippet of the code? If you haven't already, try giving the link you would like to target a class and then use that class name in your CSS as the selector. That is one of a number of ways you may be able to fix your problem. Hope this helps!