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

Yusuf Salaam
Yusuf Salaam
1,748 Points
Posted by Yusuf Salaam
Yusuf Salaam
1,748 Points

I not understanding how to do this challenge

I'm not exactly sure how to do what they are asking me in this question no matter how many times I look at the video.

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;
}
ul nav {
 margin: 0px 0 0;

}

3 Answers

Yusuf Salaam
Yusuf Salaam
1,748 Points
Yusuf Salaam
Yusuf Salaam
1,748 Points

I don't understand how to set remove the margins on the top and bottom and set the margins on the left and right to 10px.

Jacob Miller
Jacob Miller
12,466 Points
Jacob Miller
Jacob Miller
12,466 Points

Hi Yusuf,

First of all, your selector needs to be flipped around. Currently your selector ul nav is selecting all nav elements inside a ul, but you want to select all unordered lists inside the nav. So you would target the nav first, then all the ul's inside it by writing nav ul.

To set the margins, you can use the margin shorthand, which looks like this: margin: (top & bottom value here) (left & right value here);. So your margin should look like this: margin: 0 10px;. This will remove the top and bottom margin, because they are set to zero with the first value, and set the left and right margin to 10px, because they are set with the second value.

There are three different ways to write margin shorthand:

1) margin: a b c d; where a = the top margin value, b = the right margin value, c = the bottom margin, and d = the left margin.

2) margin: a b c; where a = the top margin value, b = the left & right margin, and c = the bottom margin.

3) margin: a b; where a = the top & bottom margin, and b = the left & right margin.

Then of course giving margin only one value will set all four margins to that value.

mtch
mtch
8,521 Points
mtch
mtch
8,521 Points

I went through this a minute a ago, can you please precise what you're really after, or just which part you don't really understand ?