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 How to Make a Website Customizing Colors and Fonts Write Hexadecimal Colors

Hover state for navigation

The task is to add a hover state for navigation links that changes the text color to the value #32673f. I used this code:

nav a.hover { color: #32673f; }

It keeps telling me it's wrong. Why?

7 Answers

Kevin Kenger
Kevin Kenger
32,834 Points

Hey Patsy,

Try writing it like this

nav a:hover { color: #32673f; }

If you'll notice I used a semicolon instead of a period between the a and the word hover. This specifies a pseudo class, like the hover pseudo class, for instance.

The way you have it written currently would specify an anchor tag with the class of hover.

I hope that helps!

Oskars Rukmans
Oskars Rukmans
8,288 Points

Hi, you should use :hover instead of .hover like: nav a:hover { color: #32673f; }

That seems to be the consensus from a couple of people. Thank you. I will try it.

It worked. Thanks.

Thanks - I'll try it.

That worked. Thanks, again.

What worked? I have had it exactly right and I am still getting the bummer message.

nav a: hover { color: #32673f; }

Kevin Kenger
Kevin Kenger
32,834 Points

Hey Devah,

It looks like you've got a space between a: and hover. Try removing that space and it should work.

nav a:hover { color: #32673f; }

Your answer looks right to me. Try starting over. Sometimes it seems to just keep saying bummer even after I get the right answer. When I start over and do it right the first time, it accepts it.

That worked perfectly! :)

silvia flores
silvia flores
3,464 Points

both need to have the word hover. the one previous... then the nav a:hover { color: #32673f; } boom