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

Posted by foss
foss
7,601 Points

How to make a website code challenge

How to make a website course > Adding Pages to a Website section > Step 6 of 7 code challenge > Challenge task 1 of 5

Clearly I'm missing something obvious here...since I submitted a screenshot to support and they sent me to the forums. I'm not yet seeing a place to add an attachment with my question. The code challenge keeps telling me Bummer remember to set the font size to 0.9em. So I have 

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

Can you tell what I'm doing wrong?

3 Answers

Jorge Felico
Jorge Felico
15,543 Points

Hi Mary, you actually want to select the ul with the contact-info class like so.

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

No big deal, just switch them around like the example above.

Jorge

Steve Hunter
Steve Hunter
57,712 Points

Good shout! :-)

foss
foss
7,601 Points

Jorge, thank you for pointing me in the right direction! I must have missed that explanation in the course. I've been pulling my hair out.

Jorge Felico
Jorge Felico
15,543 Points

No problem. Also, as Greg pointed out, you can also select the ul element by just referencing the class instead, so the code that Greg wrote out should also work.

Jorge

Steve Hunter
Steve Hunter
57,712 Points
Steve Hunter
Steve Hunter
57,712 Points

Hiya,

Can you paste a link to the challenge, please - I'll pick that up from there and see if I can figure out what's going wrong!

Steve.

Greg Kaleka
Greg Kaleka
39,021 Points
Greg Kaleka
Greg Kaleka
39,021 Points

Hi Mary!

For this challenge, you're supposed to target an unordered list with the class contact-info. What your code does instead is target an unordered list that's a child element of an element with a class contact-info. All you need to do to target a ul with that class (or any element with that class) is this:

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

Make sense?

P.S. I had to do some digging to find that code challenge - for future reference, you can click the "Ask a question" link on the code challenge page, and it will include a link for people to see the challenge themselves here in the forum :)

Edit: Jorge's response totally works, and is more specific than mine, which is usually better! Just keep in mind that you don't need to specify the actual element type.

foss
foss
7,601 Points

Thanks, Greg for the explanation - you completely cleared up my confusion with your response, and I also now understand why Jorge's solution might be a better one. Although I looked for a button on the code challenge page and could only find the circular question mark button in the left sidebar to contact support or the callout button to go to the forum. Again, I'm probably missing the obvious; can you tell me where I would find the Ask a Question link from the code challenge page? Definitely want to do it the right way!

Greg Kaleka
Greg Kaleka
39,021 Points

Sure thing! Note there are definitely times when you will want to not specify the element type, as in my example. For instance, say you had a .centered class, which you wanted to center on the page. You'd want that to apply to divs, text, list items, etc.

As for the Ask A Question button in challenges, over on the right, there should be a green button:

screenshot

foss
foss
7,601 Points

I think I get what you're saying - sometimes you want general rules and sometimes you want specific rules. Specifying the element.class would only apply the style to an element type with that class, where specifying just the .class would target anything that has that class applied (as long as it wasn't overridden somewhere else.) Thanks for the screenshot. Stumped. I just looked again in Firefox 39.0a2 and Chrome 41.0.2272.101 m and that code window/challenge task is full width to the right side of the browser except for the vertical left sidebar. I even shrunk the view down to 50% and that right sidebar with the arrows and Related Discussions never shows up. I'll dig around and see if there's a recommended browser.

Greg Kaleka
Greg Kaleka
39,021 Points

Yep - you definitely understand the concept!

If I shrink my browser down small enough, the challenge takes the whole width. The Ask a Question button moves to the very bottom of the page (oof!). Do you see it there?

foss
foss
7,601 Points

No, but that was a really good idea! Things in the footer (Career Resources, Treehouse for Mobile, Student Perks) do stack when I manually resize the window but that silly button never does show up. I suppose I'll just grab the link from the address bar and hope that's good enough. Thank you again for all your help today :)