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 CSS Layout Basics CSS Layout Project Creating and Styling the Layout Containers

Jonathan Buford
Jonathan Buford
2,065 Points

I fixed the syntax error in my CSS comments but the padding is still not showing for my navigation bar.

The padding I coded is still not spacing out my nav links vertically it seems...even though it has expanded horizontally- I can hover over the links farther out from the left and right.

https://w.trhou.se/njcpub51b0

Hi Jonathan,

I think you may need a margin property to space your navigation vertically. Padding is for the space inside the element's border, and margin generates space outside of the borders. This would give you a gap between each navigation link when they are vertically stacked.

Hope that helps.

1 Answer

Carl Evans
Carl Evans
11,679 Points
.name a,
.main-nav a {
    text-align: center;
  display: block;<!--step5!-moves to center?-->
  padding: 10px 15px; /*** step6-Gives seperation and makes links easier to click on touchscreen devices ***/
}

You need to add a margin-top: property and value to your CSS rule, the one which targets links in .name and .main-nav. Like John has already mentioned, margin controls the spacing outside selected elements' border(s). Padding adds or subtracts spacing between a selected element's content and border.

You should check out the CSS Box Model.

I used to get confused between margins and padding too. Sometimes you just need to review the material for it to click.

Jonathan Buford
Jonathan Buford
2,065 Points

crushed it carl. and thank you john. gonna review my good css box model notes