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

CSS How to Make a Website Adding Pages to a Website Add and Style Icons

Andreaus Perkins
Andreaus Perkins
14,402 Points
Posted by Andreaus Perkins
Andreaus Perkins
14,402 Points

Code Challenge: Add and Style Icons - Task 1 - ".contact-info ul" vs. ".contact-info"

I passed the first challenge to format the unordered list with the class of "contact-info", but I was a little confused about the code that was accepted.

The task states: "Select the unordered list with the class contact-info and set the font size to 0.9em. Then, remove all margin, padding, and list styling."

I first tried to use the code below, but it was rejected. 

.contact-info ul {
  font-size: 0.9em;
  margin: 0;
  padding: 0;
  list-style: none;
}

I finally completed the task by entering the following code: 

.contact-info {
  font-size: 0.9em;
  margin: 0;
  padding: 0;
  list-style: none;
}

With the wording of the task, I thought I was to explicitly state that I wanted to change the properties of the unordered list and not the .contact-info class as a whole.

What's the reason behind the first code-snippet being rejected, while the second snippet is accepted? Was I being too specific on a task that was meant to be more broad?

2 Answers

Jonathan Grieve
MOD
Jonathan Grieve
Treehouse Moderator 91,253 Points
Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,253 Points

I think you wanted to put ul.contact-info {} into your code.

This does what the task wants. It selects an unordered list that has a class of contact-info,

Your first snippet selects an unordered list inside anither element with a class,

Andreaus Perkins
Andreaus Perkins
14,402 Points
Andreaus Perkins
Andreaus Perkins
14,402 Points

So I should be looking for the unordered list "of" the class, not an unordered list "in" the class? And to do so, my selector is ul.contact-info ?

Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,253 Points
Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,253 Points

Yes, "with" the class is telling you to assign an unordered list a name. i.e. a class of contact-info.

Andreaus Perkins
Andreaus Perkins
14,402 Points
Andreaus Perkins
Andreaus Perkins
14,402 Points

Ok. Thanks for the help Jonathan!