Why control padding with line-height?

I was browsing this page over at meyerweb:

http://meyerweb.c开发者_运维知识库om/eric/css/edge/menus/demo.html

and I noticed something curious about the way the padding in the header is created:

h1 {margin: 0; padding: 1em 0.25em 0; font: bold 2.5em Arial, sans-serif; line-height: 0.8em; border-bottom: 1px solid silver; text-align: right; color: #557; letter-spacing: 2px;}

Now if you remove the line-height directive, it adds a little bit of padding to the top. So the line-height is functioning essentially to remove a bit of padding from the top of the h1. My question is: why not leave out line-height and change the padding-top from 1em to .9em?

I realize there are many ways to skin a cat in CSS, but I figured if an expert like meyer does it this way there is probably some reason for the choice.

Thanks, Jonah

The reason for using a line height smaller than 1em is not actually not related to the spacing on top, but rather the space between the bottom border and the bottom of the line. Perhaps an example would illustrate this better: http://www.jsfiddle.net/yijiang/tptbe/

As you can see, with the default 1em the line sits slightly above the bottom of the letters 'p' and 'g', but with 0.8em the letters are raised just below the letters 'a' and 'b', a position that is more aesthetically pleasing

To make gap between bottom edge of h1 to the line become smaller.

Like Jeff said, it's not to remove the upper padding, it's to make the text overlap the border below it slightly - changing the margin or padding on it, in either direction would not cause the same effect.