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 Adding Pages to a Website Add and Style Icons

Posted by Steven Prescott
Steven Prescott
19,206 Points

Add and Style Icons - Challenge 1 of 5

"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'm reviewing and having a bit of trouble with this. Here's my code:

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

I'm sure it's something simple I'm missing. Here's the challenge: http://teamtreehouse.com/library/add-and-style-icons -Steven

14 Answers

Nachiket Kumar
Nachiket Kumar
3,590 Points

The way you have written your selectors, what you are actually doing is telling the browser to look for a ul that is inside an element with class contact-info, which in turn is inside the html.

Simply saying .contact-info (an element with the class contact-info), or if you need to be more specific, ul.contact-info (an unordered list with the class contact-info) should be enough. The properties look fine.

Nachiket Kumar
Nachiket Kumar
3,590 Points

I might have misunderstood- you might have been trying to format the markdown to show code (it should be css, not html).

In which case if your selector is .contact-info ul, you are still asking to select a ul inside an element with class contact-info.

pantelisparros
pantelisparros
3,700 Points
pantelisparros
pantelisparros
3,700 Points

You have to erase the ul after the .contact-info and it will work fine.

Amol Wankhede
Amol Wankhede
15,727 Points
Amol Wankhede
Amol Wankhede
15,727 Points

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

tamirg
tamirg
6,201 Points
tamirg
tamirg
6,201 Points

Hi Amol,

Remove the ul after the selector. Just use .contact-info I found that once I removed the ul it allowed me to move forward.

george george
george george
5,755 Points
george george
george george
5,755 Points

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

Gonzalo Blasco
Gonzalo Blasco
11,927 Points
Gonzalo Blasco
Gonzalo Blasco
11,927 Points

Working... 

.contact-info {
  font-size: 0.9em;
  margin: 0;
  padding: 0;
  list-style: none;
}
Steven Prescott
Steven Prescott
19,206 Points
Steven Prescott
Steven Prescott
19,206 Points

You got it right the second time! Thanks

Crystal Jackson
PLUS
Crystal Jackson
Courses Plus Student 2,017 Points
Crystal Jackson
Crystal Jackson
Courses Plus Student 2,017 Points

I've written the following code at the end of the code given:

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

...and I can't pass question 1 ...what have I done wrong?

Thank you.

Crystal Jackson
PLUS
Crystal Jackson
Courses Plus Student 2,017 Points
Crystal Jackson
Crystal Jackson
Courses Plus Student 2,017 Points

.

Crystal Jackson
PLUS
Crystal Jackson
Courses Plus Student 2,017 Points
Crystal Jackson
Crystal Jackson
Courses Plus Student 2,017 Points

I solved it - thank you!

pantelisparros
pantelisparros
3,700 Points

You are welcome!

Heather Stone
Heather Stone
2,658 Points
Heather Stone
Heather Stone
2,658 Points

It's not working for me :( What selector do you use? I've tried ul .contact-info, ul.contact-info, .contact-info ul, .contact-info but none of them work :(

Heather Stone
Heather Stone
2,658 Points

I refreshed it and just .contact-info worked :)

Nachiket Kumar
Nachiket Kumar
3,590 Points

Heather Stone, I hope you understood why .contact-info worked, I think my original answer above makes it quite clear. All your other permutations are selecting different elements, which don't exist.

Wei Niu
Wei Niu
4,151 Points
Wei Niu
Wei Niu
4,151 Points

i do the exactly as what you said,

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

but it shows "Be sure to set the font size to 0.9em."

I can't get it. where is the mistake?

Nachiket Kumar
Nachiket Kumar
3,590 Points

My original answer will solve this for you, please read it again!

lina Hernandez
lina Hernandez
4,583 Points
lina Hernandez
lina Hernandez
4,583 Points

Here is the correct Answer or at least ir work for me ! .contact-info { margin: 0; padding: 0; list-style: none; font-size: 0.9em; }

tamirg
tamirg
6,201 Points
tamirg
tamirg
6,201 Points

Hi, I have done it correctly per instruction, knowledge and forum and it is still showing as incorrect? Any suggestions? I just read through the forum notes again and realized that I had to remove the ul in order for it to work.