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 trialSteph Hamilton
17,573 PointsIn this challenge, it asks you to target the list items inside .main-nav.
To get the correct answer, I didn't include .main-nav anywhere. I just answered it with: li:first-child { border: none; }
How do I know I am targeting the list items inside .main-nav if I don't include it anywhere in my code?
Thanks!
I appreciate the help.
2 Answers
Bob McCarty
Courses Plus Student 16,618 PointsStephanie, The test accepts both selectors ".main-nav li:first-child" and "li:first-child " as the correct answer. Using the ".main-nav li:first-child " selector styles only the first list item in .main-nav element. The selector without the .main-nav qualifier styles all first child list items <li> on the page.
Bob.
Gianmarco Mazzoran
22,076 PointsHi Stephanie Hamilton ,
if in your html file the only list-items that you have is inside an <ul> tag with the class "main-nav" (like in this challenge), you can select only the li tag because you don't have any other list-items inside your document.
li:first-child {
/* your awesome style */
}
Otherwise if you have, perhaps, two menus inside your html file, in order to style each one in a different way, you have to be more specific when you select the <li> tag in your css file.
.main-nav li:first-child {
/* your awesome style */
}
.second-nav li:first-child {
/* your awesome style */
}