I need to make sure height of the text is exactly same as its line. But when font-size and line-height are the same, the text is still slightly smaller then its line. See Fiddle. I use text-transform: uppercase here, so there are no extra parts that stick out, like 'y'. Any ideas how to fix it? \[code\]<div> Some Text</div>div { display:inline-block; font-family: Lucida Sans Unicode,Verdana,Arial,Helvetica,sans-serif; font-size: 20px; line-height: 20px; text-transform: uppercase; background-color: lightgreen; padding: 0; margin: 0;}\[/code\]