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
Shehan Dissanayake
19,119 PointsIn nav section, the class "selected" was applied. Does it represent all the anchor tags in nav?
<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>
In the above nav section the class "selected" is applied only to the first anchor tag. How come the About and Contact 's color change when we do the below step,
nav a.selected, nav a:hover{ color:#32673f; }
Does the class "selected" represent all the anchor tags in nav?
3 Answers
Kannan S
587 PointsNo it does not represent all anchor tags by default. I would be able to help you more if you could provide a working demo.
Vladut Astalos
11,246 PointsYour first selector of the CSS rule applies permanently those styles described only to the elements that have the class selected in this case firs 'a' element, but the second selector has a pseudo-class ':hover' which targets whatever 'a' element in the nav you are hovering over.
Shehan Dissanayake
19,119 PointsWhy don't we apply the class "selected " to below lines;
<li><a href="about.html">About</a></li>
<li><a href="contact.html">Contact</a></li>
like this;
<li><a href="index.html" class="selected">Portfolio</a></li> <li><a href="about.html" class="selected">About</a></li> <li><a href="contact.html" class="selected">Contact</a></li>
Vladut Astalos
11,246 PointsYou can think of that as a style you choose for your website. You want the page you are currently in (in this case Home page) to be highlighted from the other pages and in the same time if you want to go on another page when you hover over the link to that page you want that link to be highlighted. If you want all links to have the same color, sure you can give them all class 'selected' or you can simply select 'nav a{}' and style them however you want.