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

Marcel Hadderingh
Marcel Hadderingh
2,253 Points
Posted by Marcel Hadderingh
Marcel Hadderingh
2,253 Points

my code is not working. I typed: .contact-info{ font-size: 0.9em; } Why is this not working?

So the assignment was: Select the unordered list with the class contact-info and set the font size to 0.9em.Then remove all margin, paddding and list styling. I typed:

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

It gives me an error.

css/main.css 
a {
  text-decoration: none;
}

#wrapper {
  max-width: 940px;
  margin: 0 auto;
}

#logo {
  text-align: center;
  margin: 0;
}

h1, h2 {
  color: #fff;
}



nav a {
  color: #fff;
}

nav a:hover {
  color: #32673f;
}

h1 {
  font-family: ‘Changa One’, sans-serif;
  font-size: 1.75em;
  font-weight: normal;
}

img {
  max-width: 100%;
}

#gallery {
  margin: 0;
  padding: 0;
  list-style: none;
}

#gallery li {
  float: left;
  width: 45%;
  margin: 2.5%;
  background-color: #f5f5f5;
  color: #bdc3c7;
}

nav ul {
  list-style: none;
  margin: 0 10px;
  padding: 0;
}

nav li {
  display: inline-block;
}

nav a {
  font-weight: 800;
  padding: 15px 10px;
}

.profile-photo {
  display: block;
  margin: 0 auto 30px;
      max-width: 150px;
  border-radius: 100%;
}

.contact-info ul {
  font-size: 0.9em;
  margin: 0;
  padding: 0;
  list-styling:none; 
}
Jake Bolton
Jake Bolton
1,956 Points
Jake Bolton
Jake Bolton
1,956 Points

Hi Marcel,

Are you targeting a ul with the class of 'contact-info' or a ul in a div with that class?

Just to clarify.

Cheers, Jake

Marcel Hadderingh
Marcel Hadderingh
2,253 Points
Marcel Hadderingh
Marcel Hadderingh
2,253 Points

Hi Jake,

I am assuming that what is meant in the question is: a ul in a div with the class 'contact info'. Thats why I tried: .contact-info ul {}

thanks, Marcel

Jake Bolton
Jake Bolton
1,956 Points
Jake Bolton
Jake Bolton
1,956 Points

Hi Marcel,

Ok, so just to clarify, you're targeting it like this:

HTML - <div class="contact-info"> <ul> <li></li> </ul> </div>

CSS - .contact-info ul {...}

Also rather than list-styling: none; should be list-style-type: none; ( i Think)

Cheers, Jake

3 Answers

Isaac Asante
Isaac Asante
4,752 Points
Isaac Asante
Isaac Asante
4,752 Points

Hey there Marcel, your code is wrong. Firstly, you are selecting a non-existant UL element that is inside an element with the class .contact-info. To select the UL element with that class, you need to write your selector this way: ul.contact-info {} and not .contact-info ul {}

And secondly, list-styling is not a valid CSS property. It needs to be list-style.

So right now, you have:

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

But it should be:

ul.contact-info {
  font-size: 0.9em;
  margin: 0;
  padding: 0;
  list-style: none; 
}
Rich Bagley
Rich Bagley
25,869 Points
Rich Bagley
Rich Bagley
25,869 Points

Hi Marcel,

The challenge looks to ask for Select the unordered list with the class contact-info.

Your code appears to be for an unordered list inside a class of contact-info.

Try changing this to ul.contact-info instead of .contact-info ul.

-Rich

Marcel Hadderingh
Marcel Hadderingh
2,253 Points
Marcel Hadderingh
Marcel Hadderingh
2,253 Points

Thank you all for the solutions. It works now:) and I understand where I went wrong.

Marcel

Rich Bagley
Rich Bagley
25,869 Points

No problem. Glad they helped :)