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

Muhammed Salim
Muhammed Salim
1,592 Points
Posted by Muhammed Salim
Muhammed Salim
1,592 Points

I have added the rules correctly but still it says wrong !

.contact-info li a{ display: block; min-height: 20px; background-repeat: no-repeat; padding: 0 0 0 30px; background-size: 20px; }

/* and it still keeps telling me Bummer! why? */

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

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

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

.contact-info li a{
  display: block;
  min-height: 20px;
  background-repeat: no-repeat;
  padding: 0 0 0 30px;
  background-size: 20px;
}
#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%;
}

4 Answers

Muhammed Salim
Muhammed Salim
1,592 Points
Muhammed Salim
Muhammed Salim
1,592 Points

It worked for me when I have added the background size like this

background-size: 20px 20px ;

instead of 

background-size: 20px ;

what is the difference?

Jonathan Grieve
MOD
Jonathan Grieve
Treehouse Moderator 91,253 Points
Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,253 Points

Try using the following as your selector.

.contact-info a{
 display: block; 
}

You want to target the anchor elements inside the list but not worry about the list items. If you include the list items in the selector the challenge will fail. :-)

Muhammed Salim
Muhammed Salim
1,592 Points
Muhammed Salim
Muhammed Salim
1,592 Points

I see, thank you Jonathan.

Jeremy Hill
Jeremy Hill
29,567 Points
Jeremy Hill
Jeremy Hill
29,567 Points

For some reason I had to leave out ul and li. I did it like:

.contact-info ul{ }

It did not accept it. I had to remove ul and it accepted it.

So the heading needs to look like this. .contact-info{ }

Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,253 Points
Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,253 Points 
ul.contactinfo{}

is the correct selector but this is for a different style rule. :-)