On Sun, 2 Sep 2007, trevor bayliss wrote:
> What is line-height: 2; what value is interpreted by the browser? An em
> value or px? Sorry about this newbie question, thanks for input
>
> #footer p {
> font-size : 75%;
> line-height: 2;
> margin-top : 0;
> margin-bottom : 0;
> }
Felix explained well what it means by the specifications (and, as far as I
know, in implementations as well), so I will just throw in some educated
guesses of what the style sheet author _meant_.
This is apparently for a footer element, where paragraph (p) markup is
used, for some reason, inside <div class="footer">...</div>. The font size
there is set to 75% of the enclosing element's font size, which is
assumably the overall size for copy text. The line-height value is of
course computed from this inner, reduced font size, and it implies that
the lines of the footer paragraph will be rather far apart from each
other.
My guess is that this is really not what the author meant. The footer is
probably short, assumed to fit on one line, and the line-height value is
meant to create some vertical spacing above and below it. And that's
what it does, but and undesired effects will be caused if the page is
viewed in a narrow window, forcing the footer to wrap into two (or more)
line.
If this guesswork is close to truth, it would be both simpler and safer to
leave line-height untouched (defaulted) and directly set margin-top and/or
margin-bottom to values that create the desired vertical spacing.
By the way, people with good experience with word processors may easily
get mislead into thinking that line-height: 2 means "double spacing".
Word processors let you set line height using unitless numbers, but the
numbers have meanings different from the line-height numbers in CSS. If
you set line height to 2 in Microsoft Word, the actual height will be 2
times the default line height for the font in use. This default is
selected by Word according to the font and it is larger than the font
size, typically 14pt for a 12pt font. This creates the same effect as
adding empty lines between all lines. If you wanted to create such a
"double spacing" effect in CSS, you would have to set line-height to a
value larger than 2 - typically something like 2.4.
--
Jukka "Yucca" Korpela, http://www.cs.tut.fi/~jkorpela/
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
