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

Wil Silvestrini
Wil Silvestrini
5,069 Points
Posted by Wil Silvestrini
Wil Silvestrini
5,069 Points

What is wrong on 0.9em?

The question: 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.

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

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%;
}

2 Answers

Salman Akram
Salman Akram
Courses Plus Student 40,065 Points

Hi William,

Nothing wrong, but I see you have put SPACES between ul and contact-info

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

Should be like this without spaces below. 

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

That's why you get error messages.

Wil Silvestrini
Wil Silvestrini
5,069 Points
Wil Silvestrini
Wil Silvestrini
5,069 Points

Thanks Salman Akram!! That's it!

Colin Bell
Colin Bell
29,679 Points
Colin Bell
Colin Bell
29,679 Points

Just to expand a little bit, the space would target children with a class of contact-info of any ul

<ul>
  <li class="contact-info">This is a child of a ul and it has the contact-info class. So it gets targeted</li>
</ul>

without the space it targets only ul elements that have a class of contact-info

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

<div class="contact-info">
  <!-- This div wouldn't get the stylings of ul.contact-info -->
</div>