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

General Discussion

Posted by Krista Gomke
Krista Gomke
4,426 Points

Bummer! Error on Code Challange for CSS

Question is: 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.

So I put:

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

7 Answers

Krista Gomke
Krista Gomke
4,426 Points
Krista Gomke
Krista Gomke
4,426 Points

Sorry... I tried to do the Markdown thing... I'm really new.

Diane Houghton
Diane Houghton
5,773 Points
Diane Houghton
Diane Houghton
5,773 Points

Hi, it's em, not ems. I make the same mistake all the time.....

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

In addition to the em as Diane pointed out, you're not selecting the right element.

You're using the descendant selector .contact-info ul This would select a ul that is inside of an element with a class of "contact-info"

You want a ul that has a class of "contact-info"

ul.contact-info

No space between them.

Hope this helps

Krista Gomke
Krista Gomke
4,426 Points
Krista Gomke
Krista Gomke
4,426 Points

Oh Jason that could be it. That's not what was in my lesson though... I'll try it tomorrow. Diane, I did it with both em and ems. Ems is what's in my lesson. Sigh. Might have to do it over again.

Krista Gomke
Krista Gomke
4,426 Points
Krista Gomke
Krista Gomke
4,426 Points

Update: neither of those suggestions worked. Jason I believe my .contact-info ul is correct because the warning is about my font size, not my selector. And it doesn't make a difference if I'm using em or ems - I've used every combination I of the two suggestions I can.

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

What's the link to the code challenge? Normally I verify the answers I give here by completing the code challenge but your post didn't link to it.

Instead I went with the question as you posted it.

You tried both of those things at the same time?

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

Also, in regards to the errors, they don't always make sense based on the error you've made.

Since the error is about font size it could still be the selector. The code checker could be checking the font size and noticing it's not set correctly because the selector never matched up.

Krista Gomke
Krista Gomke
4,426 Points
Krista Gomke
Krista Gomke
4,426 Points

Turns out the answer was:

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

No "li" or "ul" needed. Weird.

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

You actually get an error if you do that same exact code but use ul.contact-info for the selector? (No space between them)

Krista Gomke
Krista Gomke
4,426 Points
Krista Gomke
Krista Gomke
4,426 Points

You know what, I didn't check the error when I used the ul.contact-info. But like I said, in the tutorial that wasn't how it was typed out. It was .contact-info and then ul or a or whatever the selector was. The answer was actually .contact-info {}, no mention of the ul at all. That might just be specific to the tutorial that it was referencing though, which is the Intro Web Design - CSS...

http://teamtreehouse.com/library/add-and-style-icons question 1

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

Ok, I was able to verify that it passes both ways. With or without the ul

I can tell you from other code challenges that it won't always be the case that you can do that.

One thing to keep in mind is that you won't always be typing things the same as you saw in the tutorial. The code challenge might want you to do something a little different to check your understanding of it.

In practice, either selector will probably select the same thing. .contact-info or ul.contact-info However, the second one is more specific. Sometimes the code challenge will want you to be more specific and it will give hints for this. There are times where it won't pass if you don't have that element in front of the class name.

Just something to keep in mind to save you some frustration on future code challenges.