Centrar menú de navegación con display:Inline-block;

Hay momentos en el cual necesitemos ó necesitaremos que nuestro menú de navegación (nav) este centrado en nuestra pagina web, hay distintas forma de hacerlo desde los float, hasta ahora el nuevo display:inline-block; que nos trae CSS3 con una manera menos engorrosa para centrar nuestro menu. Acá presento una forma muy fácil y sencilla de centrar los elementos ul li dentro de un nav, acá dejo un ejemplo con sus respectivos codigos html y css3. En la parte inferior de este articulo usted podrá ver la demostración en vivo. Colocamos el siguiente código html dentro de tu menú de navegación «nav»

<nav>
	<ul>
		<li><a href="#link01">Botón Centrado 01</a></li>
		<li><a href="#link02">Botón Centrado 02</a></li>
		<li><a href="#link03">Botón Centrado 03</a></li>
	</ul>
</nav>

colocamos el CSS

li{
 list-style: none;
 }
 nav {
 text-align: center;
 }
 nav ul {
 display: inline-block;
 margin: 0;
 padding: 0;
 /* Para IE 7*/
 zoom:1;
 *display: inline;
 }
 nav li {
 float: left;
 padding: 2px 5px;
 border: 1px solid black;
 background-color:#CCC;
 margin: 50px;
 border-radius: 5px;
 }
 nav li a{
 text-decoration: none;
 font-family: century gothic;
 color: #000;
 }
 nav li a:hover{
 color: #fa8b09;
 }

VER DEMO