nicht angemeldet
Hallo,
Das überbreite blaue etwas, meine ich, das soll 2pixel hoch sein keine 80!
Ein SPAN ist ein Inline-Element. Hier dürfte eine Breiten- und Höhenangabe eigentlich _überhaupt_ nicht funktionieren. Diese sind für Blocklevel- und Replaced-Elemente wie Bilder usw. vorgesehen.
http://www.w3.org/TR/REC-CSS2/visudet.html#the-height-property
So gesehen, machen es alle Browser falsch.
Der IE setzt zusätzlich eine bestimmte Zeilenhöhe an. Warum er das nur in der letzten Tabellenzelle macht, ist nicht zu erklären. Abhilfe schafft hier, die Schriftgröße auf den gewünschten Wert zu setzen.
Hier sind zwei Beispiele, wie es gehen könnte. Mein Favorit ist das zweite Beispiel, weil Du da kein SPAN in eine Block-Ansicht zwingen musst.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Balkendiagramm</title>
</head>
<body>
<table style="border: 1px solid #000000; width: 208px;">
<tr>
<td style="border:0 none; font-size:2px; height:4px;"><span style="display:block; width: 12px; height: 2px; background-color: #c80000;"> </span></td>
</tr>
<tr>
<td style="border:0 none; font-size:2px; height:4px;"><span style="display:block; width: 94px; height: 2px; background-color: #008cff;"> </span></td>
</tr>
</table>
<hr noshade size="1">
<table style="border: 1px solid #000000; width: 208px;">
<tr>
<td style="border:0 none; height:4px;"><div style="font-size:2px; width: 12px; height: 2px; background-color: #c80000;"> </div></td>
</tr>
<tr>
<td style="border:0 none; height:4px;"><div style="font-size:2px; width: 94px; height: 2px; background-color: #008cff;"> </div></td>
</tr>
</table>
</body>
</html>
viele Grüße
Axel