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

HTML How to Make a Website Responsive Web Design and Testing Refactor the Layout

Posted by fuck teamtreehouse
fuck teamtreehouse
2,179 Points

Clear left on 4th child element

@media screen and (min-width:480px) {
  #primary {
    width:50%;
    float:left;
  }

  #secondary {
    width:40%;
    float:right;
  }
  #gallery li{
    width:28.3333333%;
  }
  #gallery li:nth-child(4th){
    clear:left;
  }
  .profile-photo {
    float:left;
    margin: 0 5% 80px 0;
  }
}

Tree house isn't accepting my answer. It doesn't recognize that I've cleared left for some reason. Am I doing something wrong?

4 Answers

Jacob M.
Jacob M.
5,122 Points
Jacob M.
Jacob M.
5,122 Points

You should use 4 instead of 4th in the nth-child selector.

fuck teamtreehouse
fuck teamtreehouse
2,179 Points
fuck teamtreehouse
fuck teamtreehouse
2,179 Points

...thank you! The browser is more forgiving than the validator Tree House is running.

Cody Sheets
Cody Sheets
7,198 Points

Agreed, however the validator is specific because they want to teach the correct way. When you move into things like PHP, you will find that the browser can't forgive everything.

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

ayelet olin -

> The browser is more forgiving than the validator Tree House is running.

I don't think so. Your markup didn't work as :nth-child(4th) isn't valid CSS.

You are correct the browser never throws errors it just silently fails and makes the best of whatever you give it, wether that's what you were trying to get it to do or not.

fuck teamtreehouse
fuck teamtreehouse
2,179 Points
fuck teamtreehouse
fuck teamtreehouse
2,179 Points

thanks all for the input, it's really helping. I thought I knew about html+css but watching these videos I'm finding there is more out there to be learned.

Jason Anello
PLUS
Jason Anello
Courses Plus Student 94,610 Points
Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

The directions say to clear every 4th list item so you really should be using :nth-child(4n)

It does pass with 4 but that doesn't meet the requirements.

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

That's an overly permissive code correctness check and should be reported as a bug via the submit feedback button, which can be found at the end of every code challenge.

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

I wonder if this only shows up the first time you complete a challenge. I completed this one several more times just now and didn't see that button. Only a button to "keep going"

I will go ahead and follow the procedure for submitting a bug on the support page.