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 trialWillem Folscher
933 Pointshelp with question
I'm struggling with this question , and cannot seem to get it right?
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) {
}
4 Answers
elk6
22,916 PointsIn the second question you need to select every 4th li, so not just the first 4th item.
Put this in you rmedia query. That will select every 4th li inside the gallery.
#gallery li:nth-child(4n+4) {
clear: left;
}
elk6
22,916 PointsIf it's the first question, you need to change the width of the gallery list items to 28.3333% inside the media query at the bottom of the style sheet. The one that targets screens with a minimal width of 480px.
Like this:
@media screen and (min-width: 480px) {
#gallery li {
width: 28.3333%;
}
}
Willem Folscher
933 Pointsyes the second part is the issue
Willem Folscher
933 Pointsthank you so much!
elk6
22,916 PointsNo problem!
Good luck with the course.