Ver Mensaje Individual
  #25 (permalink)  
Antiguo 27/11/2009, 07:46
Impostor
 
Fecha de Ingreso: agosto-2008
Mensajes: 469
Antigüedad: 15 años, 8 meses
Puntos: 20
Respuesta: Centrar menú de navegación horizontal

Holas, habeis hecho un gran trabajo, si me permites, solo voy a depurar un poco el código, quitando cosas no necesarias.

Las clases .derecha e .izquierda no son necesarias, tampoc los div, se pueden eliminar, mas unas cosillas mas que no son necesarias, asi quedan los códigos:

Código:
.nav{
  width: 960px;
  height: 63px;
  background:url(images/fondo_menu.png) repeat-x;
}

ul.menu{
  list-style-type:none;
  width:880px;
  margin: 0 auto;
  padding:0px;
}

ul.menu li {
  font-size:12px;
  font-family:Arial, Helvetica, sans-serif;
  line-height:63px;
}

ul.menu li.divider {
  width:5px;
  height:63px;
  float:left;
  background:url(images/menu_sep.png) no-repeat center;
}

ul.menu li a{
  color:#FFF;
  display:block;
  float:left;
  margin:0 14px;
  height:35px;
  text-decoration:none;
  text-transform:uppercase;
}

ul.menu li a span:hover, .current{
  background:#ba122b;
}

ul.menu li a span{
  padding: 8px 7px 10px 7px;
}
y el html

Código HTML:
<div class="nav">
                 <ul class="menu">
                <li><a href="#" title="Volver al inicio"><span>Inicio</span></a></li>
                <li class="divider"></li>
                <li><a href="#" title="Empresa"><span>Empresa</span></a></li>
                <li class="divider"></li>
                <li><a href="#" title="Servicios"><span>Servicios</span></a></li>
                <li class="divider"></li>
                <li><a href="#" title="Productos"><span class="current">Productos</span></a></li>
                <li class="divider"></li>
                <li><a href="#" title="Noticias"><span>Noticias</span></a></li>
                <li class="divider"></li>
                <li><a href="#" title="Distribuciones"><span>Distribuciones</span></a></li>
                <li class="divider"></li>
                <li><a href="#" title="Contáctenos"><span>Localización y contacto</span></a></li>
            </ul>
        </div> 
Saludos¡¡