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 Styling Web Pages and Navigation Create a Horizontal List of Links

Joshua Howard
Joshua Howard
12,798 Points

Cannot get this to work.

I've tried combining this into one line also. Like (padding: 15px 10px 15px 15px;). I don't see what i'm doing wrong here. It's pretty simple CSS.

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

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

}

nav ul li {
    display: inline-block;
    font-weight: 800;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 10px;
    padding-right: 10px;

}

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

You have to select the anchor tags.. this should work

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

3 Answers

Hi,

can you try the code like this, The challenge was to select the links inside nav.

nav ul {
  margin-top: 0; 
  margin-left:10px;
  margin-bottom:0;
  margin-right:10px;
  padding:0;
  list-style:none;
}

nav ul li {
    display:inline-block;
    font-weight:800;

}

nav ul li a {
    padding-top: 15px;
  padding-left:10px;
  padding-bottom:15px;
  padding-right:10px;
}

You can try like "nav a" also , it will work.

Thanks, Aishu

Aaron HARPT
Aaron HARPT
19,845 Points

If you are talking about your nav ul li rule, it looks like you have the paddings set to top: 15, bottom: 15, right: 10, and left: 10, instead of the padding: 15 10 15 15 you have above: "Like (padding: 15px 10px 15px 15px;)." For the shorthand property, it should be top, right, bottom, left.

Joshua Howard
Joshua Howard
12,798 Points

I see, I just forgot to target the anchor attribute in the css selector. Thanks Guys! I swear I know this stuff already hahaha