Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

HTML How to Make a Website Customizing Colors and Fonts Write Hexadecimal Colors

Posted by Kevin Chisholm
.a{fill-rule:evenodd;}techdegree
Kevin Chisholm
Front End Web Development Techdegree Student 1,741 Points

Challenge Task 4 of 4 nav a, nav a:hover { #32673f } I know this is wrong but I don't know what to use.

Challenge Task 4 of 4

nav a, nav a:hover { #32673f } I know this is wrong but I don't know what to use.

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

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

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

h1, h2 {
  color: #fff
}

p {
  color: #000
}

nav a {
  color: #fff
}

nav a, nav a:hover {
  #32673f
}
Kevin Chisholm
.a{fill-rule:evenodd;}techdegree
Kevin Chisholm
Front End Web Development Techdegree Student 1,741 Points

Challenge Task 4 of 4

Question: Add a hover state for navigation links that changes the text color to the value #32673f.

Does anyone know how this should be done?

2 Answers

Ryan S
Ryan S
27,275 Points
Ryan S
Ryan S
27,275 Points

Hi Kevin,

You pretty much got it. Notice that you are missing the "color" property in your last rule.

Also, by including both nav a and nav a:hover, you are effectively overriding your previous nav a rule from task 3. It seems this will still pass the challenge, but in practice it would cause unwanted behaviour by changing your links to the same color as the hover value.

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

Good luck.

Anthony Lafont
Anthony Lafont
17,075 Points
Anthony Lafont
Anthony Lafont
17,075 Points

Hi Kevin,

You just have to use de property "color":

a {
  text-decoration: none;
}

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

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

h1, h2 {
  color: #fff
}

p {
  color: #000
}

nav a {
  color: #fff
}

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