Can't make my nav bar smaller

Question

I'm in the middle of making my nav bar and I just can't seem to make it any smaller, right now it looks too thick for what I want and I have tried altering padding, margins etc and can't seem to get it to budge. Altering height makes it thinner but then the links don't move with the div and will not centered vertically. It's probably a simple oversight but I'm not seeing it and would appreciate the help!

HTML:

<nav>
        <ul>
            <li><a href="index.html">Home</a></li>
            <li><a href="gallery.html">Gallery</a></li>
        </ul>
    </nav>

CSS:

body     {
background-color:#000;
color:#fff;
}


p       {
text-align:center;
}

img     {
display:block;
margin-left:auto;
margin-right:auto;
padding:10px;
}

nav     {
background-color:#808080;
display:inline-block;
text-align:center;
padding:0;
width:1000px;
list-style:none;
}


nav ul li        {
display:inline-block;
}

Answer 1

Add this to your css:

ul{
 margin:0;
}

PS. This is useful only if you wanted to reduce the thickness of menu bar (as you mentioned in question). If you want a more formatted navigation you'll have to add a couple things more in this.

Answer 2

You should be use float, margin and padding for ul and li. Hera is an example

nav ul li {
    float:left;
    margin-right:10px;
    list-style:none;
}