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

Justin Joyce
Justin Joyce
9,572 Points
Posted by Justin Joyce
Justin Joyce
9,572 Points

stuck

I do not understand what i am doing wrong with adding a hover state to a nav link. The code is attached.

css/main.css 
a {
  text-decoration: none;
}

#wrapper {
  max-width: 940px;
  margin: 0 auto;
}

#logo {
  text-align: center;
  margin: 0;
}

h1 {
  color: #fff
}

h2 {
  color: #fff
}

p {
  color: #000
}

nav a{
  color: #fff,

}

nav:hover {
  color: #32673f
}
Justin Joyce
Justin Joyce
9,572 Points
Justin Joyce
Justin Joyce
9,572 Points

Than you for the help! I didn't realize I need to create a whole new element.

3 Answers

Joshua Edwards
Joshua Edwards
52,175 Points
Joshua Edwards
Joshua Edwards
52,175 Points

you need to add the hover to the link element (a) not the nav element

Justin Joyce
Justin Joyce
9,572 Points
Justin Joyce
Justin Joyce
9,572 Points

I put the hover with the (a) element instead of the nav and I am still getting "Did you style nav links hover state (:hover)?"

jamescool
jamescool
44,592 Points
jamescool
jamescool
44,592 Points

You might be missing some punctuation after the majority of your CSS rules. See if that helps...

Biwash Lama
Biwash Lama
13,772 Points
Biwash Lama
Biwash Lama
13,772 Points

Your code could work if you are hovering into nav element. also you need add a semi-colon after the rules that you are missing.

you might hovering into a link which is inside nav element, In that case, it should be:

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

or if you would like to add that hover effect in your whole document for the links. In that case, you could just write:

a:hover { color:#32673f; }