Axel Richter: phänomen zeilenhöhe

Beitrag lesen

Hallo,

ich habe ein phänomen, nach dessen ursache ich seit nahezu einer woche suche und keine lösung finde.
ich habe ein 17 pt hohes textmenü, in das ich rechts 3 grafische elemente mit rollover effekt einfügen will. das grafische element ist auch genau 17 pt hoch, zudem habe ich diese höhe in html auch noch definiert. wenn ich das ding jedoch implementiere, wird die zeile automatisch höher und zwar um schätzungsweise 2 pt. wenn ich dann das grafische element um 2 pt kleiner (15 pt gross) erstelle dann bleibt zwar die menüzeile in der originalgrösse, dafür habe ich unter dem grafischen element einen ca. 2 pt breiten streifen.

Das "Phänomen ist dadurch begründet, dass Bilder als Inline-Elemente auf der Text-Grundlinie dargestellt werden.
<img src="http://java.sun.com/j2se/1.3/docs/api/java/awt/doc-files/FontMetrics-1.gif" border="0" alt="">
Der Abstand, den Du siehst, ist die Unterlänge, die für die Buchstaben p g q ... benötigt wird.
Eine Lösung wäre, das Bild als Block-Element darzustellen.

<html>
<head>
</head>
<body>
<table>
<tr>
<td style="border-bottom:1px solid black;"><img src="bild.gif" alt="Bild" style="width:40px; height:40px; border:0 none;">Text mit Unterlängen</td>
</tr>
<tr>
<td style="border-bottom:1px solid black;"><img src="bild.gif" alt="Bild" style="width:40px; height:40px; border:0 none; display:block; float:left;">Text mit Unterlängen</td>
</tr>
</table>
</body>
</html>

viele Grüße

Axel