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 trialDouglas Walker
2,608 Pointsstuck on ntd-child for 4th list item in gallery task
here is my code:
#gallery li:ntd-child(3n+1) { clear: left; }
a {
text-decoration: none;
}
#wrapper {
max-width: 940px;
margin: 0 auto;
}
#logo {
text-align: center;
margin: 0;
}
h1, h2 {
color: #fff;
}
nav a {
color: #fff;
}
nav a:hover {
color: #32673f;
}
h1 {
font-family: Changa One, sans-serif;
font-size: 1.75em;
font-weight: normal;
}
img {
max-width: 100%;
}
#gallery {
margin: 0;
padding: 0;
list-style: none;
}
#gallery li {
float: left;
width: 45%;
margin: 2.5%;
background-color: #f5f5f5;
color: #bdc3c7;
}
nav ul {
list-style: none;
margin: 0 10px;
padding: 0;
}
nav li {
display: inline-block;
}
nav a {
font-weight: 800;
padding: 15px 10px;
}
.profile-photo {
display: block;
margin: 0 auto 30px;
max-width: 150px;
border-radius: 100%;
}
.contact-info {
list-style: none;
padding: 0;
margin: 0;
font-size: 0.9em;
}
.contact-info a {
display: block;
min-height: 20px;
background-repeat: no-repeat;
background-size: 20px 20px;
padding: 0 0 0 30px;
margin: 0 0 10px;
}
@media screen and (min-width: 480px) {
#gallery li {
width: 28.3333%;
}
#gallery li:ntd-child(3n+1) {
clear: left;
}
}
4 Answers
Sam Baines
4,315 PointsHi Douglas you have an issue in your syntax - the term is nth with a (h) not ntd with a (d) as below:
/* This is incorrect
#gallery li:ntd-child(3n+1) { clear: left; }
*/
#gallery li:nth-child(3n+1) { clear: left; }
Hope this helps.
Per Karlsson
12,683 PointsThere's a typo in nth-child. You've spelled it ntd-child :) Hope this helps!
Douglas Walker
2,608 PointsStill coming up with error for the objective...
@media screen and (min-width: 480px) {
#gallery li { width: 28.3333%; }
#gallery li:nth-child(3n+1) { clear: left; } }
Sam Baines
4,315 PointsThis is because to pass the challenge you need to use the pseudo nth-child selector with the value (4n) rather than the (3n+1) - its an error in the challenge and it rectified with the (3n+1) in the teachers notes for the course.
Douglas Walker
2,608 PointsGreat! Thanks Sam and Per, it was because of 3n+1 not being 4n. Challenge error as you said. Have a good day!