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 trialCosmin Iuga
2,352 PointsSelect the unordered list nested inside the nav element. Remove the margins on the top and bottom. Set the margins on th
Select the unordered list nested inside the nav element. Remove the margins on the top and bottom. Set the margins on the left and right to 10px.
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;
}
6 Answers
Chris Shaffer
12,030 PointsAndrew's answer is correct, however any time you're setting top/bottom values equal and/or right/left values equal, you can use that as a shortcut.
/*all margins */
margin: 10px;
/*top&bottom left&right */
margin: 0px 10px;
/*top, left&right, bottom*/
margin: 0px 10px 0px;
/*top, right, bottom, left */
margin: 0px 10px 0px 10px
Irfan Setiadi
Courses Plus Student 2,638 Pointsnav ul {
margin : 0 10px;
}
Cosmin Iuga
2,352 PointsThank you Andrew. I complicate myself to no end... Can't keep things simple...
Cosmin Iuga
2,352 PointsThank you Chris. It worked...
Chris Shaffer
12,030 PointsTracy, Sorry as I've just seen this answer and hope you've figured it out by now ;).
But for clarity for anyone who reads this:
margin: 0px 10px 0px 10px;
Is equivalent to:
margin: 0px 10px;
Like I posted above, when top and bottom are equal values, they can be represented by the first value, so long as left and right are also the same as each other.
There are many CSS values that follow this rule, such as borders.
In most cases there is a general and specific CSS value; margin vs margin-top, background vs. background-color.
For example, you can represent all background-*
values by just calling "background" and defining them in order.
Border is an easy example:
border-width: 1px;
border-style: solid;
border-color: #000;
Is equivalent to:
border: 1px solid #000;
Hope that helps!
Chris Shaffer
12,030 Pointsnav ul {
margin:0 10px;
}
Tracy Nordlund
2,601 PointsI tried this ^ a couple times and it didn't work. It worked with nav ul { margin: 0 10px 0 10px; }. Do the two behave differently?
Andrew Stelmach
12,583 PointsAndrew Stelmach
12,583 Points