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

Quierra Wells
Quierra Wells
7,705 Points
Posted by Quierra Wells
Quierra Wells
7,705 Points

I Dont know why my answer for Question three is no longer correct.

I am on question 5 and each time I check my work question three is now wrong. Whats happening here?

My Code

.contact-info  {
  font-size:0.9em;
  list-style:none;
  margin:0; 
  padding:0;
}
.contact-info a {
  display:block;
  min-height:20px;
  background: no-repeat;
}

.contact-info li a {
  background:20px;
  padding:0 0 30px 0;
}
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
*********/

.contact-info  {
  font-size:0.9em;
  list-style:none;
  margin:0; 
  padding:0;
}
.contact-info a {
  display:block;
  min-height:20px;
  background: no-repeat;
}

.contact-info li a {
  background:20px;
  padding:0 0 30px 0;
}

3 Answers

tootiemcflow
tootiemcflow
5,601 Points

Hey Quierra, I think the problem is with your third CSS rule/block. You're padding: 0 0 30px 0; declaration is set to the bottom and not the left side. Remember the short hand order is Top, Right, Bottom, Left. Also the background-size: 20px; declaration needs a second value of 20px to be squared. The first value with the background-size property will control the width and the second value will control the height.

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

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

Edit: I forgot to mention that when only applying one value to the background-size: 20px; property it will set the first values width (in this case 20px) and the height to auto.

Jovanny Elias
Jovanny Elias
16,204 Points
Jovanny Elias
Jovanny Elias
16,204 Points

I edited the code you posted to so its easier to read on the forum look below to see how Its done so next time you can do the same.

How to Post Code to the Treehouse Forum

I tried to go in and do the quiz but I am on my phone and it really does not work well so I can't see what the question 3 says can you let me know please.

One possibility is that if you restarted the challenge and copy pasted the code you used before you may have entered additional information that still was not asked of you to enter.

Quierra Wells
Quierra Wells
7,705 Points
Quierra Wells
Quierra Wells
7,705 Points

Thanks for the help! I was missing the code to make it square!