Propriedade line-height com height dobrado a cada quebra de linha

[androidel 7]

Boa noite,

 

Estou tendo problemas com a propriedade line-height. Por exemplo, temos uma div, nessa div irei adicionar:

vertical-align: middle;
line-height: 50px;
background-color: #07F;
height: 50px;
width: 100%;

Ainda dentro dessa div, eu adiciono um texto, mas quando dou quebra de linha é como se cada quebra de linha pulasse mais 50px, ou seja, o height subiria para 100px.

 

Como faço para resolver esse problema?

[William Bruno 1501]

Sim, exatamente isso. É isso que line-height faz.

 

Oque vc quer ? para centralizar o texto na vertical, estude sobre vertical-align

[androidel 7]

Sim, exatamente isso. É isso que line-height faz.

 

Oque vc quer ? para centralizar o texto na vertical, estude sobre vertical-align

 

Olá Willian,

 

Eu quero centralizar o texto na vertical, até aí tudo bem, mas como faço para centralizar o texto sem que quando eu dê uma quebra de linha ou quando você ultrapassa a largura determinada, sem dobre o height a cada um desses fatores que citei?

 

@EDIT

 

Eu havia testado a propriedade vertical-align, mas não funcionou.

[William Bruno 1501]

Funciona sim, basta utilizar ela corretamente.

 

O container deve ter altura declarada igual ao elemento a ser centralizado, e vc deve usar display: table-cell;

 

é com vertical-align que se faz o que vc quer. Estude.

[androidel 7]

Funciona sim, basta utilizar ela corretamente.

 

O container deve ter altura declarada igual ao elemento a ser centralizado, e vc deve usar display: table-cell;

 

é com vertical-align que se faz o que vc quer. Estude.

 

Olá William,

 

Consegui! Obrigado! :D