Looking for some help with my nav menu bar

[Foppa]

I have a couple questions about my navigation menu bar.

#1 - I want my nav bar's width to be 100% but there is about a 10px gap on each side. How can I get it 100% wide?

#2 - I used one of those menu creators for the basic coding and can't seem to figure out how to center or move my nav bar menu options. I would like them centered on the page or slightly off-centered.


Below is my code -

The HTML:

<ul id="menu">
<li><a href="index.html" title="" class="current">Home</a></li>
<li><a href="services.html" title="">Products</a></li>
<li><a href="contact.html" title="">Contact</a></li>
</ul>

The CSS:

ul#menu {
width: auto;
height: 43px;
background: #FFF url("images/menu3-bg.jpg") top left repeat-x;
font-size: 1.1em;
font-family: "Lucida Grande", Verdana, sans-serif;
font-weight: bold;
list-style-type: none;
margin: 0;
padding: 0;
}
ul#menu li {
display: block;
float: left;
margin: 0 0 0 5px;
}
ul#menu li a {
height: 43px;
color: #FFF;
text-decoration: none;
display: block;
float: left;
line-height: 125%;
padding: 8px 12px 0;
}
ul#menu li a:hover {
color: #0b5d8d;
}
ul#menu li a.current{
color: #FFF;
background: #942838 url("images/current2-bg.jpg") top left repeat-x;
padding: 5px 12px 0;
}

Thanks!