Space on Navigation right and left...how to remove it?

Question

Right now my navigation looks like this:

There is huge spaces at the ends of it, and I don't really know how to take it out.

CSS:

nav { background: #282828 url(../images/nav-bg.png) repeat-x; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; margin: 24px auto; padding: 18px 29px; width: 670px; }
nav ul { margin: 0 auto; }
nav ul li { background: url(../images/nav-sep.jpg) left center no-repeat; display: inline; padding: 32px; margin: 0 auto;  }
nav ul li:first-of-type { background: none; }
nav ul li a { color: #626262; font: 16px Arial, Helvetica, serif; }

Answer 1

Change this part. The second value is the amount of padding on the right and left.

nav { padding: 18px 29px; }

Answer 2

Try changing the width to something smaller than 670px in your first rule there, and change the padding to a smaller value if needed.

Answer 3

If u r talking about the space after contact menu item that i think it can resolved by changing the width set on ul tag. i think you can remove it all together by setting display:inline on the ul tag