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 trialAndrew Mills
6,073 Pointsselected portfolio
I'm curious, I typed both the html and css exactly like the class example however portfolio is only dark green when hovered over. Earlier I clicked on the portfolio link, will this have any bearing on it's color?
6 Answers
Ilias Loukakis
20,489 Pointsmake sure you include the pseudo-class nav a.selected WITH nav a:hover together with the same color for instance:
nav a.selected, nav a:hover { color: example; }
also make sure that in html you have the class="selected" on the appropriate list element of the navigation, if everything is correct it should work normally
Hope that helps
Andrew Mills
6,073 Pointshere are examples of my css and html
logo {
text-align: center; margin 0; }
a{ color: #6ab47b; }
header { background: #6ab47b; border-color: #599a68; }
h1, h2 { color: #fff; }
nav { background: #599a68; }
nav a, nav a:visited { color: #fff; }
nav a.seceted, nav a:hover { color: #32673f; }
body { background-color: #fff; color: #999; }
HTML <body> <header> <a href="index.html" id="logo"> <h1>Andrew Mills</h1> <h2>Designer</h2> </a> <nav> <ul> <li><a href="index.html" class="selected">Portfolio</a></li> <li><a href="about.html">About</a></li> <li><a href="contact.html">Contact</a></li> </ul> </nav> </header> <div id="wrapper">
Jeff Busch
19,287 PointsHi Andrew,
Each link should turn green when hovered over. The Portfolio link is green because it was visited (it pointed to index.html). The other links don't stay green when clicked on because they point to files that don't exist, therefore they are not visited as far as the browser is concerned. Hope this clears things up.
Jeff
nav a.selected, nav a:hover {
color: #32673f;
}
Andrew Mills
6,073 Points<li><a href="index.html" class="selected">Portfolio</a></li>
nav a.seceted, nav a:hover { color: #32673f; }
still no dice, bizzare
Jeff Busch
19,287 PointsNot so bizarre, check your spelling. Your mistake(s) should even be apparent in these text fields that you type in the forum. Look for the squiggly red underlines.
Andrew Mills
6,073 Pointsah! thank you Jeff (egg on my face)