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

Posted by brian reyes
brian reyes
992 Points

I need help with the background element. I don't know what I'm doing wrong.

The background element looks right, but it keeps saying bummer.

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

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

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

.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;
  padding: 0 0 0 30px;
}

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

Jason Anders
MOD
Jason Anders
Treehouse Moderator 145,860 Points
Jason Anders
Jason Anders
Treehouse Moderator 145,860 Points

Hi Brian,

When you only input one value into background-size, that value is assigned to the width. The height then, by default, is set to auto.

So if you need to set both the width and height to 20px, you do need to use 2 values.

background-size: 20px 20px;

Keep Coding! :)

Joel Hernandez
seal-mask
.a{fill-rule:evenodd;}techdegree
Joel Hernandez
Front End Web Development Techdegree Student 2,571 Points
Joel Hernandez
.a{fill-rule:evenodd;}techdegree
Joel Hernandez
Front End Web Development Techdegree Student 2,571 Points

The code for background size should be defined for both sides of the image. Since it goes Top, Right, Bottom, Left it is wanting you to input 20px for Top/Bottom and 20px for Right/Left.

background-size: 20px 20px;

^ This could should clear the challenge.

To explain further, the default value for the background-size is auto. When you have your code saying the background-size = 20px you are telling the stylesheet that the Top and Bottom are 20px and the Left and Right are Auto.

brian reyes
brian reyes
992 Points

thanks!