Centrar encabezado sobre background

bidock · #1 (**permalink**) 09/03/2011, 16:13

Hola amigos, aver si pueden resolverme esta duda.

Tengo un h3 con un background-image de 30px de alto. El problema es q el texto del h3 no me keda centrado verticalmente sobre la imagen de background. Si meto el encabezado en un div no hay problemas pero hay alguna forma de centrarlo sin necesidad de div. He probado con padding-top y se centra pero sobresale y empieza a repetir la imagen por debajo.

Gracias.

sanxuan · #2 (**permalink**) 09/03/2011, 17:16

Puede que te sirva el utilizar la propiedad line-height:30px;

bidock · #3 (**permalink**) 10/03/2011, 06:13

Perfecto, ha funcionado, muchisimas gracias

Pero si la imagen tiene una altura de 30px si yo le aplico ese valor al line-height ¿no deberia salirse el texto de la imagen? No entiendo muy bien como funciona.

Gracias de nuevo

sanxuan · #4 (**permalink**) 10/03/2011, 07:00

La propiedad line-height no define la altura del texto, eso lo hace font-size.
Lo que se modifica con line-height es la altura de la caja que encierra al texto, es decir, cambiamos la distancia entre renglones.
Para que line-height centre adecuadamente el texto de un renglón debe eliminarse el padding (o hacer que sea igual el superior y el inferior y descontarlo del valor de line-height).

bidock · #5 (**permalink**) 12/03/2011, 09:13

Ok ya lo he entendido, muchisimas gracias por la aclaracion.

Saludos