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 Use Classes in CSS

Elah Spence
Elah Spence
352 Points
Posted by Elah Spence
Elah Spence
352 Points

My links will not change color when I hover over them

My links will not change colors when I hover over them and I've looked over my code and other question like this and nothing seems to work and my code is type correctly. I would love if some one could get back to me ASAP so i could have this done by Friday thanks a lot.

Chyno Deluxe
Chyno Deluxe
16,936 Points

Can you please post your HTML and CSS.

How to post Code

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

Hi Elah,

You can post a snapshot of your workspace.

https://teamtreehouse.com/forum/workspace-snapshots

4 Answers

Daniel Botta
Daniel Botta
17,956 Points
Daniel Botta
Daniel Botta
17,956 Points

On line 17 in your index.html you will need to put parenthesis around the class name "selected" where it is declared. Also, on line 36 of main.css i think you may need to put a comma between nav a.selected and nav a: hover since you are declaring the same rule to both elements.

I hope this helps!

Sam Baines
Sam Baines
4,315 Points
Sam Baines
Sam Baines
4,315 Points

HI Elah - in your css you can't have a space between the anchor selector and the colon and the hover pseudo class - so it needs to be like below:

a:hover {
color: blue;
}
Mauricio Zambrano
Mauricio Zambrano
14,849 Points
Mauricio Zambrano
Mauricio Zambrano
14,849 Points

you are declaring wrong the hover state, if you just want the the selected item to have a hover go like nav

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

Chyno Deluxe
Chyno Deluxe
16,936 Points
Chyno Deluxe
Chyno Deluxe
16,936 Points

Here are a couple changes that need to be made on your index.html and main.css files. Line 17 of the index.html is missing "" around the class selected.

index.html: line 17

<li><a href="index.html" class="selected">Portfolio</a></li>

Line 36 of the main.css is missing a comma between the two declarations and you need to remove the space between the a:hover.

main.css: line 36

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