Posted by Jukka K. Korpela on 10/24/07 10:26

Scripsit jodleren:

> It it pretty simple.

There are no simple problems, just simple solutions, most of which are
wrong. But what is the _problem_? We can immediately see that what you
probably see as a solution creates serious problems, but what was the
problem it was supposed to solve?

> I have a stylesheet like:
> <STYLE TYPE="text/css">
> TABLE { font-family : "Arial", "Helvetica", "Monaco"; font-size :
> 10.0pt; text-decoration : none;}
> </STYLE>

Bad style. Sizes in points cannot be easily be increased on IE, and this
implies that they will be too small to hundreds of millions of potential
readers. (I don't say billions, but that's just because you wouldn't believe
it.)

> Which means that <td>Hello world!</td> I get a font size 10.

Maybe, maybe not. That depends on other style sheets, and even markup. But
most of the time, you do. And that's part of a problem.

> But I get 3 pixels above the letters, which I'd like to reduce by one
> or two. Is there a way to do that?

There is varying spacing above and below the letters - surely more above "e"
than above "H". Again, what is the problem you are trying to solve?

You could add

table { line-height: 1; }

to set the line height the same as the font size, which typically means that
there is very little (or no) spacing above capital letters.

But what would happen later? When you write "Foobar" or "Hello world",
everything may look OK to what. Yet, some day the text will be edited to
contain text like École, Å, etc., maybe even letters with multiple
diacritics.

As a rule of thumb, set line-height to a reasonable value in the document as
a whole, e.g.

* { line-height: 1.25; }

(By the way, this helps against some browser bugs that have nothing to do
with line height, really.)

Then adjust it for specific elements _if_ problems arise, and make sure the
problem you create is less serious than the one you are trying to solve.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

[Back to original message]