Prueba a incluir el siguiente CSS dentro de la regla #nav. Si lo colocas al final funcionará si no quieres sustituir las propiedades que tienes:
{margin:0 auto; width:570px}
Con eso deberías conseguir un menú centrado en la pantalla del ancho que se indica.
Para que la barra azul ocupe todo el ancho de la pantalla debes introducir tu elemento <ul> dentro de un <div>, o si lo prefieres añadir la etiqueta <div id="menu"> antes de <ul> y </div> después de </ul>.
En el CSS incluyes la siguiente regla:
#menu{ background: url("three_0.gif") repeat-x scroll 0 0 #FFFFFF; }
y ya deberías tener lo que pienso que buscabas.