Centering a CSS <div> Menu

Well I have a CSS menu, but it is constantly docked left, and I want to center it.

Text alignment dosent work, as that only centers the text ON the menu, which is done already.

I have tried adjusting left and right margins to 0, and stuff like that, but to no avail.

HTML

Code:

<div id="navigation">
<div id="menu"><ul>
	><li><a href="#">Homepage</a></li>
			<li><a href="#">Blogs</a></li>
			<li><a href="#">Photos</a></li>
			<li><a href="#">About</a></li>
			<li class="last"><a href="#">Contact</a></li>
		</ul></
</div></div>

CSS

Code:

/* Menu */

#menu {
	float: left;     /* No this isn't it */
	width: 880px;
	height: 58px;
	
	
	
}
#navigation{
    margin:auto;
}

#menu ul {
	margin: 0;
	padding: 23px 0 0 20px;
	list-style: none;
	line-height: normal;
}

#menu li {
	float: left;    /* Or this */
	text-align: center;
}

#menu a {
	display: block;
	padding: 0 50px;
	background: url(../../emporium1/emporium/emporium/images/img03.jpg) no-repeat right 50%;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 11px;
	color: #FFFFFF;
}

#menu a:hover { 
	color: #FFFFFF;
}

#menu .current_page_item a {
	color: #FFFFFF;
}

 

easy as pie

Code:

#navigation{
  width: 880px ;
  margin-left: auto ;
  margin-right: auto ;
}

 

absolutely position your #navigation:

Code:

#Navigation {
position: absolute;
margin: 0 auto;
}

that should do that.