Cita:
Iniciado por kseso? 
¿Puede publicar sus códigos (html+css) implicados en ese elemento?
Gracias por contestar.
Adjunto el código que he probado a partir del las modificaciones que he realizado en el ejemplo que me adjuntas.
Los botones, que irían con una imagen de fondo para "nav li a" y otra para "nav li a:hover" con este código se me quedan separados unos pixeles.
Y el tamaño en altura de "nav li a"; si lo defino en 35 px, ya no me aparece centrado, y si lo dejo sin definir, para el centrado que realiza "#nav li::before", me ajusta la altura a la del texto.
Voy a intentar poner una imagen de como estoy intentando que quede (en la que no se me centra verticalmente), y como me queda con este codigo.
Gracias y un saludo.
Código HTML:
.Menu {
height: 35px;
width: 960px;
margin-top: 2px;
}
#nav {
list-style:none;
padding:0;
display: block;
}
#nav li {
background: #E1C4BD;
text-align: center;
width: 96px;
height: 35px;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
display: inline-block;
}
#nav li a {
display: inline-block;
vertical-align: middle;
width: 95%;
border: #a0a0a0 solid 1px;
background: #f5f5f5;
text-align: center;
font-size: .9em;
font-family: monospace;
}
#nav li::before {
content: '';
display: inline-block;
height: 100%;
vertical-align: middle;
margin-right: 0 em; /* espaciado entre .ejemplo:before y .contenido */
/* Para ver el pseudoelemento
background: #9DC425; width: 5px;
*/
}
-->
</style></head>
<body>
<div class="container">
<div class="content">
<div class="Menu">
<ul id="nav">
<li><a href="#">1 línea</a></li>
<li><a href="#">dos líneas dos líneas</a></li>
<li><a href="#">dos líneas dos líneas</a></li>
<!-- end lista navegación .nav --></ul>
<!-- end .menu --></div>
<!-- end .content --></div>
<!-- end .container --></div>
</body> 
