Pregunta
¿Cómo centrar un texto verticalmente con CSS?
Responder esta pregunta por dudin el 2009-05-19
El caso es que tengo una lista desordenada y deseo que los textos correspondientes a cada item queden centrado verticalmente, la altura de cada elemento li es fija.
<ul id="lista">
<li>Mi texto 1 a centrar en la vertical con CSS</li>
<li>Mi texto 2 a centrar en la vertical con CSS</li>
<li>Mi texto 3 a centrar en la vertical con CSS</li>
</ul>
Mientras que el CSS aplicado hasta ahora es el siguiente:#lista ul {
margin: 0;
padding: 0;
}
#lista ul li {
margin: 0 0 10px 0;
padding: 0 10px 0 10px;
height: 64px;
}
Respuestas
Centrar verticalmente un texto dentro de la etiqueta li puede lograrse asignándole el alto de línea del texto igual al alto total del li.
#lista ul li {
margin: 0 0 10px 0;
padding: 0 10px 0 10px;
height: 64px;
line-height: 64px; /* Para centrar*/
}
Ahora si el texto tiene más de una línea no funcionará correctamente. por dudin el 2009-05-19



