Line-Height - Does not Leave Vertically Centralized Text

2

I'm using line-height to center a text vertically. But the text seems to me to have a small margin. See the image below, I selected the font to see better the spacing that is making the difference when it comes to centering.

Can you fix this?

#userNome{width:98%;margin:auto;margin-top:50px;margin-bottom:20px;line-height:2;text-align:center;background-color:#FFF;border-radius:5px;font-family:"Luckiest Guy";
    color: #AF3846;
    font-size: 26px;
    &.show{
        display: block;
    }
}

<div id="userNome">Olá, Diego Souza</div>
    
asked by anonymous 25.06.2015 / 19:32

1 answer

1

The line-height does not serve to align the text vertically, who does this is the vertical-align (in your case, you want vertical-align: middle; ).

However, line-height is required because vertical-align align according to line height and not the container the text is in, ie you still need line-height .

    
25.06.2015 / 19:37