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

Posted by Tomas Mraz
Tomas Mraz
Courses Plus Student 7,630 Points

set the padding in links in nav

i dont understand.. i write nav li { display: inline-block; font-weight: 800; padding: 15px 10px;

}

but still not working... where is the problem?

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 {
  margin: 0 10px;
    padding: 0;
  list-style-type: none;
}

nav li {
  display: inline-block;
  font-weight: 800;
  padding: 15px 10px; 
}

3 Answers

Nicholas Grenwalt
Nicholas Grenwalt
46,626 Points

For the last part of the challenge it asks you to target the links in the nav. Those are the anchor tags. To target them it would be "nav a". So do that for both the font-weight and padding on that item instead of the list items and you should be good to go. Hope that helps. Provided a code snippet to clarify. Good coding to ya!

nav ul {
 margin: 0 10px; 
 padding: 0;
 text-decoration: none;
}

nav li {
 display: inline-block;
}

nav a {
  font-weight: 800;
  padding: 15px 10px;
}
Tomas Mraz
Tomas Mraz
Courses Plus Student 7,630 Points

thx a lot.... i hope it will work... :)

Eric Martz
Eric Martz
16,007 Points
Eric Martz
Eric Martz
16,007 Points

Just saw that this was linked to a challenge, and checked it out, so I am editing my answer.

The challenge is to select the links in the nav element. In your CSS you are selecting the li elements in the nav element.

Tomas Mraz
Tomas Mraz
Courses Plus Student 7,630 Points

thats the crazy part :D i dont have html in this exact code challenge... create the horizontal list of links... https://teamtreehouse.com/library/how-to-make-a-website/styling-web-pages-and-navigation/polish-the-navigation-and-footer

this is the course :/ i dont get it :/

Tomas Mraz
Tomas Mraz
Courses Plus Student 7,630 Points

thx for trying to help me man... have fun.. good luck :)

Tomas Mraz
Tomas Mraz
Courses Plus Student 7,630 Points

thx for trying to help me man... have fun.. good luck :)

Nicholas Grenwalt
Nicholas Grenwalt
46,626 Points
Nicholas Grenwalt
Nicholas Grenwalt
46,626 Points

Will do Tomas. Don't be afraid to ask for some help if you need it. There are a lot of people willing to help. Treehouse has a wonderful community. Best of luck to you as well. :)