Pues estoy intentando crear un menu en css, con <li> y demas, y necesito centrar el texto de dentro + la imagen que acompaña al boton tanto horizontal como verticalmente, pero no soy capaz de hacerlo, solo me sale de forma horizontal.
He mirado manuales y demas, pero de momento ninguno me ha servido, a ver si me podeis echar una manilla.
Gracias!
http://www.joindota.com/en/start
Como el menu de arriba, no tan bonito, simplemente con que este alineado vertical y horizontalmente cada boton me vale.
Si es texto, para alinearlo horizontal haz un "text-align:center" y para centrarlo vertical ponle el atributo "line-height:ALTURA-DEL-DIV".
Por ejemplo:
div{
height:20px;
width:200px;
}
li a{
line-height:20px;
text-align:center;
}
Debería funcionarte, ya nos cuentas ;-)
El tema es que tambien lleva una imagen dentro de ese div, por lo tanto no creo que funcione el line height.
Pero lo probare y os comento, gracias!
#6 La imagen se encuentra dentro de la etiqueta "a", es decir, en la misma etiqueta que el texto o fuera? El line-height debes aplicárselo a la etiqueta que englobe ambos elementos.
Elimino ejemplo y te pongo el enlace de como debería ser:
http://jsfiddle.net/2JWhb/
#6
Aquí tienes otra opción
http://jsfiddle.net/c227X/2/
Como puedes ver se alinea al medio independientemente del alto de la img
http://jsfiddle.net/c227X/3/
He conseguido poner este en mi web, http://jsfiddle.net/2JWhb/ pero no entiendo muy bien porque se queda la parte de la izquierda en negro, y un margin con el div que esta inmediatamente arriba, cuando no hay ningun margin ni nada 
Edit: Ahora mismo esta asi
Si, busco algo parecido a eso.
Aunque el problema tambien se me presenta cuando quiero centrar verticalmente por ejemplo, en el formulario de login arriba, he intentado reproducirlo como en los ejemplos anteriores, pero sin exito.
Aunque en el de login solo quiero centrado vertical claro.
#12 Debo de ser un poco corto porque no sé a qué te refieres, en la foto que has adjuntado lo veo centrado :wtf:
No obstante, si quieres compartir el código, quizá entre todos lleguemos a una solución. Si lo tienes muy avanzado y no te apetece ponerlo visible, ¿quizá por mensaje privado? Pero es que no entiendo a lo que te refieres, ya ves que la primera vez ni me acerqué jajaja
en #4 tienes la respuesta. Si no te sale es porque no tienes especificados valores absolutos de width o height.
Es simple, alguna propiedad te habrás dejado o también podrías machacarla.
Aquí te dejo ejemplo:
Espero que te sirva.
A parte del menu, que eso si que lo centra bien, me refiero a un div normal, no lo centra verticalmente poniendo lo de line height.
No definir width y heights en px, que luego te vuelves loco xDD. Sin el código es difícil ver donde esta el problema, pero yo voto porque estás heredando alguna propiedad de alineamiento de la parte superior o de otra clase?
#14 Por lo que dices de los pixels, intuyo que no estás haciendo ningún diseño "responsive". Presuponiendo eso, ¿has probado a colocar el div dónde quieras con position: absolute (o relative)?
Sé que no es muy ortodoxo, pero de malas te puede sacar de un apuro, aunque estoy seguro que si especificaras un poco el código salía en seguida la solución...
