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

Posted by jose macedo
jose macedo
6,041 Points

why is my .selected class not staying the color of my hover color?

https://w.trhou.se/ak55bp7jvc idk how to add code any other way

1 Answer

Tanja Schmidt
Tanja Schmidt
11,798 Points
Tanja Schmidt
Tanja Schmidt
11,798 Points

Hi, you added three classes to your anchor element: home-nav, nav-hover and selected.

<a href="index.html" class="home-nav nav-hover selected">Home</a>

In your CSS you defined a color for the selected-class - and a bit later on you also defined a color for your home-nav-class. (in a way you contradict yourself here). Because of the cascading nature of css the later rule overwrites your earlier rule.

.nav-hover:hover, .selected {
 color: #1a8cff; 
}

/*some more code in between*/

.home-nav {
   text-decoration: none; 
   color: #333333;
   font-size: 18px;
   font-weight: 600;  
   border-right: solid #8c8c8c 1px;
   padding: 20px 50px 19px 10px;
   position: relative;
   top: 0px;
   right: 35px;
}