CSS vertical alinea el centro en círculos

Question

Estoy intentando verticalizar el texto central en el ancla. Utilicé la altura de línea y funciona, pero cuando el texto se ajusta, el texto en la segunda línea obtiene la altura de la línea ... ¿Cómo puedo centrar el texto en el ancla sin fallar así?

http://jsfiddle.net/y2UYX/1/ - Haga clic en el círculo para revelar los otros círculos y verá lo que quiero decir.

Me gustaría apoyar la mayor cantidad posible de navegadores. si agrega propiedades adicionales para admitir más navegadores, indique qué línea es para qué navegador agregando comentarios.

¡Muchas gracias!

Answer 1

Puede usar mostrar: tabla propiedad para esto. escribir así:

.SubMenu li { 
    margin:50px; 
    background:red; 
    border-radius:50px; 
    height:100px; 
    width:100px; 
    display:table; 
} 

.SubMenu a { 
    height:100px; 
    width:100px; 
    display:table-cell; 
    text-align: center; 
    vertical-align: middle; 
} 

Marque esta http://jsfiddle.net/y2UYX/6/

Answer 2

Puede usar el estilo de elemento para que

element.style { 
line-height: 13px; 
padding-top: 37px; 
height: 60px;}