nicht angemeldet
Hi Kai,
STOP! <span> ist ein Inline-Element unt halt als
solches neue height.
ups - mir ist es nicht gelungen, die Aussage in diesem Satz-Fragment fehlerfrei zu decodieren ...
Im M$IE 5.5 funktioniert es nahezu perfekt
damit ist dieser Browser kaputt.
Kein Widerspruch von meiner Seite.
(Höchstens zur Bezeichnung "Browser" für diese Betriebssystemerweiterung. ;-)
Mozilla 0.9.9. ignoriert sämtliche Höhenangaben
des <span> und stellt den Balken offenbar so
hoch dar wie dsa <td>. Das ist für meine Zwecke
unbrauchbar.
er stellt das Span 10Pixel hoch dar (die
line-height) - sofern die Schriftgröße keinen
größeren Wert erfordert.
Hm. Und wenn sie es täte?
Verstehe ich Dich richtig, daß ich die line-height auf 0px setzen und dann sowohl im <td> als auch im <span> mit der Schriftgröße erzwingen könnte, die jeweils passende Höhe meines Elements zu erzwingen ...
Nein, das tut auch nicht, bei line-height:0px bricht die Tabelle völlig auseinander.
Ich könnte auch versuchen, zu jeder Zahl eine Nachbarzelle zu bauen, dieser eine line height zu geben ... aber das funktioniert auch nicht. Mist! Die "line-height:" kann sich nicht gegen die "font-size:" durchsetzen.
Danach habe ich an der "font-size:" herumgeschraubt. Damit könnte ich in Mozilla dann tatsächlich die Höhe des Balken beeinflussen. Beim M$IE allerdings wieder nicht - und bei Opera 6 funktioniert zwar die Balkenhöhe, aber der Balken ragt wieder nach unten aus der Tabellenzelle heraus.
Und vor allem: Dadurch geht natürlich die Breite des Balkens kaputt! Mit der "font-size:" ändert sich auch die Breite des Leerzeichens ... und das wiederum hat Vorrang gegenüber der expliziten "width:"-Definition meines <span> ... !"§$&*+@
Nein, von der "font-size" muß ich wohl die Finger lassen.
Opera 6.0 ... läßt den Balken nach unten über
den Zellenrand hinaus ragen. Das ist noch
schlechter.
und auch kaputt.
Ja, eben. Lauter kaputte Browser, es ist schlimm. Lernen die es denn nie? :-(
Die zentrale Frage scheint mir zu sein, wie ich
die Höhe eines <span> innerhalb eines <td>
abweichend von den Eigenschaften des sonstigen
<td>-Inhalts setzen kann ...
gar nicht. ein <span> hat keine Höhe.
Akzeptiert.
Andere Frage: Gäbe es denn irgend ein tag, welches ich statt <span> nehmen könnte?
Oder ist mein Wunsch grundsätzlich unmöglich, weil sich individuelle Höhe und mehrere Tags in einer Zeile gegenseitig ausschließen?
Die korrekte Angabe um in der Zeile zu bleiben
UND ein Element mit höhe zu haben wäre zusätzlich
display:inline-block; zu setzen.
... diese Lösung sieht in Mozilla sehr gut aus.
Mit den '_' (immer noch notwendig wegen Opera) sieht sie leider entsetzlich aus (die underscores schweben unterhalb des Balkens separat herum); ohne sie werden zwar die Balken so, wie ich sie haben will, dafür aber verliert die gesamte <td> ihre "text-align:right;"-Eigenschaft und die Zahlen werden plötzlich linksbündig statt rechtsbündig dargestellt (und der Balken rechts daneben geklebt).
Weißt Du dagegen vielleicht auch ein Mittel? Natürlich will ich die Zahl immer noch rechtsbündig haben, nur eben rechts daneben lauter gleich breite Balken ...
Allerdings sind dafür dann sowohl Opera wie auch
IE zu doof -
Und Mozilla auch.
Bisher hat nichts wirklich funktioniert ...
Nicht ganz so schön, aber wenigstens funktionierend
ist die Lösung das <span> zunächst auf display:block
zu setzen und dann den neuen Kasten mit float:right;
NEBEN den Text zu setzen.
Ah - verstehe: Wegen Blocklevel-Klassifikation darf es eine eigene Höhe haben, und float verhindert den Zeilenumbruch ... das ist einen Versuch wert.
Aber leider funktioniert auch das nicht - und zwar in _allen_ Browsern.
Übrigens auch noch unterschiedlich:
-
Opera 6 ist der einzige, der nach Deinem Modell tatsächlich das neue Blocklevel-Element rechts neben den Zahlenwert setzen und die Höhe interpretieren würde.
Dafür aber ignoriert Opera in diesem Fall das "vertical-align:" und setzt den Balken an die Oberkante des <td>. -
Mozilla 0.9.9 und M$IE 5.5 verhalten sich hier übereinstimmend: Beide weigern sich, das neue Blocklevel-<span> in dieselbe Zeile wie den sonstigen <td>-Inhalt zu setzen.
Also ein Reinfall auf der ganzen Linie ...
Übrigens zeigt bei mir Opera (6.0Beta1/Linux) auch
die <span> an, die ein enthalten.
Tja, 6.0 ohne Beta unter Win98 tut es nicht.
Und darüber habe ich mich eigentlich am meisten geärgert, weil es dafür so gar keinen ersichtlichen Grund zu geben scheint.
Immer noch ratlos über diese vielen Browserleichen
Michael
... eine halbe Stunde später:
Inzwischen habe ich wenigstens eine Lösung gefunden hat, welche zwar noch eine Verdoppelung der Zellenzahl kosten würde, aber dafür in allen Browsern ohne GIFs und ohne weitere Tabellen funktioniert:
<td>3472-</td>
<td class="col" title="-500" style="line-height:3px;">
<div class="col" style="background-color:#ff0000;"> </div>
</td>
Bei <div> als Blocklevel-Element kann ich die "line-height:" individuell manipulieren, brauche keine "font-height:" und habe deshalb konstant breite Balken (deren Breite via CSS-Datei extern eingestellt wird).
Dafür brauche ich aber leider sowohl im <td> als auch im <div> einen Klassennamen, weil ich das "text-align:" nur im <td> und die "width:" nur im <div> einstellen kann (und class="" in beiden Fällen immer noch kürzer ist als das Attribut selbst).
Im Gegenzug habe ich immerhin die "color:" eingespart, weil Opera 6 den Anzeigefehler von <span> </span> bei <div> nicht mehr macht ... der M$IE 5.5 sein bescheuertes Dauerblinken allerdings schon.
Zusätzliche Verbesserung: Das Binden des "title" an das <td> statt an den Balken macht diese Angabe viel leichter mit der Maus bedienbar - die flachen Balken für den Tooltip zu treffen war bisher ziemlich schwierig.
Das hätte ich auch schon für das vorherige Modell so machen sollen - naja, immerhin habe ich das jetzt gelernt.
Insgesamt ist das zwar nun nicht annähernd das Ergebnis, welches ich zu finden gehofft hatte, aber falls bis zur Archivierung dieses Threads nichts Besseres mehr entdeckt wird, dann werde ich diese Methode in meinen Generator implementieren.