Opera macht Tabellen-Spalte breiter als nötig
Markus Möller
- html
Hallo zusammen!
Ich habe das Problem, dass ich eine riesige Tabelle in viele kleine zerlegt habe und das nun die Spaltenbreiten in den einzelnen Tabellen u.U. dem übergrossem Inhalt angepasst werden, sodass das Layout nicht mehr stimmt.
Die Spalten sind in den Tabellen unterschiedlich breit, das ganze sieht nicht mehr wie eine Tabelle aus.
Deshalb möchte ich, dass der Inhalt ggf. einfach abgeschnitten wird und habe mir eine Lösung gebastelt, bei der der TD-Inhalt einfach nochmal in ein DIV gepackt wird, das mit CSS den Text auf eine bestimmte Breite zwingt.
MSIE, Mozilla und NS machen das.
Opera leifert aber ein seltsames Bild:
Zwar ist der Text abgeschnitten, aber die Spalte ist trotzdem so breit, wie sie wäre, wenn der Text nicht abgeschnitten wäre.
Das folgende Beispiel zeigt das Phänomen.
Was kann ich da machen?!
Danke im Vorraus!
<html>
<head><title>test</title></head>
<body>
Mal mit DIV:
<table border="1" width="100px">
<tr>
<td>
<div style="background-color:blue;color:white;max-width:100px;width:100px;overflow:hidden;">
Hallo dies ist ein wirklich sehr sehr langer Text, der leider auch noch sehr
dämlich ist, weil er das Wort MeineOmaFährtInUrlaubUndNimmtVieleSachenMitSpiel
enthält!
</div>
</td>
</tr>
</table>
Und mal ohne:
<table border="1" width="100px">
<tr>
<td>
Hallo dies ist ein wirklich sehr sehr langer Text, der leider auch noch sehr
dämlich ist, weil er das Wort MeineOmaFährtInUrlaubUndNimmtVieleSachenMitSpiel
enthält!
</td>
</tr>
</table>
</body>
Hallo Markus,
...habe mir eine Lösung gebastelt, ...
Nanana, gebastelt wird nur in der Not. Solange man es mit standardkonformen Methoden hinbekommt sollte man diese doch auch nutzen, oder?
Schauen wir uns doch mal Deinen Code an:
<table border="1" width="100px">
px-Angaben gehören meines Wissens nach zu CSS, nicht in HTML. HTML-Attribute werten i.d.R. Zahlen immer als Pixel (vgl. http://selfhtml.teamone.de/html/referenz/attribute.htm#table).
Hast Du an dieser Stelle schon mal probiert die Breiten per CSS zu setzen? Klappte bei mir wunderbar.
<table border="1" sytle="width : 100px">
Grüße aus Würzburg
Julian
Hallo nach Würzburg
Nanana, gebastelt wird nur in der Not. Solange man es mit standardkonformen Methoden hinbekommt sollte man diese doch auch nutzen, oder?
Klar, aber bekomme es irgendwie nicht hin.
Schauen wir uns doch mal Deinen Code an:
<table border="1" width="100px">
px-Angaben gehören meines Wissens nach zu CSS, nicht in HTML. HTML-Attribute werten i.d.R. Zahlen immer als Pixel (vgl. http://selfhtml.teamone.de/html/referenz/attribute.htm#table).
Hast natürlich recht. Ist geändert...
Hast Du an dieser Stelle schon mal probiert die Breiten per CSS zu setzen? Klappte bei mir wunderbar.
<table border="1" sytle="width : 100px">
Mmmh, bei mir nicht. Hier läuft Opera 6.02 und das ist der (neue) Code:
<table border="1" style="width:100px">
<tr>
<td style="width:100px">
<div style="background-color:blue;color:white;max-width:100px;width:100px;overflow:hidden;">
Hallo dies ist ein wirklich sehr sehr langer Text, der leider auch noch sehr
dämlich ist, weil er das Wort MeineOmaFährtInUrlaubUndNimmtVieleSachenMitSpiel
enthält!
</div>
</td>
</tr>
</table>
Problem noch einmal auf den Punkt gebracht: Der Text wird zwar auf 100px abgeschnitten, die Tabelle ist trotzem breiter. Und zwar so breit, wie sie ohne Beschneidung sein würde.
Vielleicht gibt's ja auch ne andere, eine einfachere Lösung. table-layout:fixed klappt ja leider nur beim IE.
Hallo,
Vielleicht gibt's ja auch ne andere, eine einfachere Lösung.
Weise max-width: 100px; dem Element table zu.
MfG, Thomas
Hallo und Danke!
Weise max-width: 100px; dem Element table zu.
Also so?!
<table border="1" style="width:100px;max-width:100px;">
Erstens bringt das keine Änderung und zweitens würde mir das auch nicht helfen, da dies nur ein Beispiel ist. In Wirklichkeit möchte ich ja mehrere Spalten haben, da würde es nichts bringen, die Tabellenbreite zu setzen. Da müßte ich schon TD anstatt TABLE nehmen (ja, hab ich auch schon versucht, hilft auch nichts).
Hallo Markus,
mal ne andere Frage:
Wieso sind eigentlich Wörter da, die nicht in die Spalte passen?
a) Selbst eingetippt (ließe sich vermeiden)
b) Weil text aus DB, Formular odgl. kommt. Da dann per Skript eingesetzt, könnte hier eine Umbruchfunktion eingebuat werden, die Wörter eben nach - was weiß ich - 50 Zeichen anschneidet und in die nächste Zeile weiterschreibt.
So so als Alternativansatz.
Grüße aus Würzburg
Julian
Hallo Julian!
mal ne andere Frage:
Wieso sind eigentlich Wörter da, die nicht in die Spalte passen?
a) Selbst eingetippt (ließe sich vermeiden)
b) Weil text aus DB, Formular odgl. kommt. Da dann per Skript eingesetzt, könnte hier eine Umbruchfunktion eingebuat werden, die Wörter eben nach - was weiß ich - 50 Zeichen anschneidet und in die nächste Zeile weiterschreibt.
b) ist richtig. Es ist ein Servlet, dass die HTMl-Datei generiert. Ich habe auch schon überlegt, ob ich einfach dort Zeichen abschneide. Nur nach wievielen Zeichen soll ich denn abschneiden, wenn ich beispielsweise 250px Platz habe. Lautet der Text "iiiiii" passt vielmehr rein als bei "WWWWWW". Außerdem kann der Benutzer per CSS-Datei die Ausgabe an seine Bedürfnisse anpassen (Stichwort Corporate Design). D.h. mein Servlet kennt grundsätzlich nicht die Schriftgröße, Schriftart etc.
Das alles macht diese Lösung zu einem nicht gerade einfachen Unterfangen...