lista non ordinata come navigazione

[FenixDown]

ciao a tutti...
io ho questo ul configurata così

div#menu {
	background-image: url(images/menu.gif);
	background-repeat: no-repeat;
	height: 57px;
	width: 100%;
}

ul#nav
{
	padding:0;
	margin: 0px;
	width: auto;
}
ul#nav li {
	list-style-type: none;
	float: left;
	height: 46px;
	padding-right: 2px;
	padding-left: 2px;
	margin: auto;
}
ul#nav li a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: #000099;
	font-variant: small-caps;
	font-size: 13px;
	font-weight: bold;
	display: block;
	height: 100%;
}

ul#nav li a:hover
{
 background:url(images/menuhover.jpg);
}

e utilizzata così

<div id="menu">
<ul id="nav">[*]Menu 1[*]Menu 2[*]Menu 3 [/list]
</div>

Quindi, le varie voci del menu sono poste una accanto all'altra orizzontalmente. Il quesito è: come centrare questi item della lista al centro del div menu? Essi ora sono tutti verso sinistra...

suggerimenti? grazie e ciao

[gabip87]

margin:0 auto;

/*     oppure margin:10px auto 30px auto;     */
/*     (top, right, bottom, left) modificando i valori      */

[FenixDown]

ho messo margin: 0 auto in

ul#nav

il problema è che per funzionare devo impostare una larghezza in qualche modo...non c'è un sistema per fare adattare questo oggetto al numero di elementi?

[Dexx]

avevo lo stesso problema:
spero questo esempio ti aiuti:

css:
ul
{text-align: center;}
li
{
display: inline;
list-style-type: none;
padding-right: 20px;
}


HTML

<ul>[*]Item one[*]Item two[*]Item three[*]Item four[*]Item five[/list]