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!

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

Posted by Joseph Davis
Joseph Davis
2,971 Points

My Nav element is off center is there something I should check?

My Nav element is off center is there something I should check? My CSS for the nav is

nav { text-align: center; padding: 10px 0; margin: 20px 0 0; }

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

nav li { display: inline-block; }

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

2 Answers

karthikkn
karthikkn
5,397 Points

nav { padding: 5px 5px; margin: 3px auto; }

Try this joseph Davis. It may help you

Jeff Lange
Jeff Lange
8,788 Points
Jeff Lange
Jeff Lange
8,788 Points

David Jarrin's answer there should be what you're looking for.

If that doesn't work, I can't see your HTML so it's hard to tell, but it's also possible that it IS centered, but that it just LOOKS uncentered because of the way your words happen to be. If you just want to modify it slightly for aesthetic purposes, you could tinker with the padding on the left or right side (whichever is necessary) to scoot it to where you want it.

If the problem is that they are stacked vertically when they should be horizontal, you need this in your CSS:

nav li {
  display: inline-block;
  }