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

Posted by Patsy Tisdale
Patsy Tisdale
5,049 Points

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
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
Oskars Rukmans
Oskars Rukmans
8,288 Points

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

Patsy Tisdale
Patsy Tisdale
5,049 Points

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

Patsy Tisdale
Patsy Tisdale
5,049 Points

It worked. Thanks.

Patsy Tisdale
Patsy Tisdale
5,049 Points
Patsy Tisdale
Patsy Tisdale
5,049 Points

Thanks - I'll try it.

Patsy Tisdale
Patsy Tisdale
5,049 Points
Patsy Tisdale
Patsy Tisdale
5,049 Points

That worked. Thanks, again.

Devah Lucus
Devah Lucus
1,066 Points
Devah Lucus
Devah Lucus
1,066 Points

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
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; }
Patsy Tisdale
Patsy Tisdale
5,049 Points
Patsy Tisdale
Patsy Tisdale
5,049 Points

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.

Devah Lucus
Devah Lucus
1,066 Points

That worked perfectly! :)

silvia flores
silvia flores
3,464 Points
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