Why are some Unicode characters taller than normal text?

I noticed that some unicode chars are taller than the normal text.

E.g. the diagonal arrows (North East Arrow ↗, South East Arrow ↘, ...), they claim more space on top of the letter than a normal text.

<body style="font-size:48px;">
    <div style="border:1px solid #00ff00;float:left;">
        1-<br>2-<br>3-<br>4-<br>5-<br>6-<br>7-<br>8-<br>9-
    </div>
    <div style="border:1px solid #ff0000;float:left;margin-left:5px;">
        -1<br>-2 &#8599;<br>-3<br>-4 &#8599;<br>-5<br>-6 &#8599;<br>-7<br>-8 &#8599;<br>-9
    </div>
</body>

http://jsfiddle.net/q5LEt/

You can see the dashes moving down every time an arrow is in the same line.

How can I avoid this behaviour, e.g. by CSS?

Solution

You can avoid it by explicitly specifying a line-height:

line-height: 1em;