Tabelle grösser als Fenster

[mkaufman]

Hallo zusammen

Ich erstelle eine kleine Online-Applikation um die Helfer für ein Fest vom Verein einzuteilen.
Unter
http://www.synthas.ch/eplanung/static.html
könnt ihr ein Beispiel einer generierten Tabelle sehen. Ich möchte, dass alle Spalten eine gewisse Breite haben.
Das geht gut, solange die Tabelle insgesamt schmaler als das Browserfenster ist.
Sobald sie breiter wird, beginnen die Browser daran herumzumurksen.

Gibt es da eine Möglichkeit, die Breite zu erzwingen?
Oder muss ich ggf. mit blind-Pixeln arbeiten?
Es ist volle Absicht, dass die Tabelle breiter als das Fenster wird.
Es ist mir vollkommen bewusst, dass horizontal-scrolling verpönt und unschön ist, aber hier kann ich mit den Konsequenzen leben.

Vielen Dank für eure Hilfe!
Matthias

[dey]

Hallo,

Hallo zusammen

Ich erstelle eine kleine Online-Applikation um die Helfer für ein Fest vom Verein einzuteilen.
Unter
http://www.synthas.ch/eplanung/static.html
könnt ihr ein Beispiel einer generierten Tabelle sehen. Ich möchte, dass alle Spalten eine gewisse Breite haben.
Das geht gut, solange die Tabelle insgesamt schmaler als das Browserfenster ist.
Sobald sie breiter wird, beginnen die Browser daran herumzumurksen.

<table class="tabelle">
So etwas darf man hier (selfforum) nicht machen (da kommt die Polizei), sinnvoll wäre z.B. class="plan".
Ich denke du musst deiner tabelle eine feste (errechnete Breite verpassen), z.B. style="width:1800px".

bydey

[dey]

Hallo,

<table class="tabelle">
So etwas darf man hier (selfforum) nicht machen (da kommt die Polizei), sinnvoll wäre z.B. class="plan".
Ich denke du musst deiner tabelle eine feste (errechnete Breite verpassen), z.B. style="width:1800px".

Alles Blödsinn

Hier:
.leerfeld, .eintrag, .header, .zeitfeld { border-style:solid; border-width:1px; border-color:black;  overflow:hidden; padding:1px; width:20% }
wie oft kannst du bei 100% 20% vergeben?

so wird ein Schuh draus:
.leerfeld, .eintrag, .header, .zeitfeld { border-style:solid; border-width:1px; border-color:black;  overflow:hidden; padding:1px; width:200px }

bydey

[mkaufman]

Hallo dey

Danke für deine Antwort. Das verwendete CSS ist unschön, das gebe ich zu. Ich hatte die hoffnung, dass 10x 20% so etwas wie 200% machen würde, also doppelte fensterbreite. Das war nur so eine spielerei...
Leider nützt es auch nichts wenn ich die breitenangabe im stylesheet ändere, die gesamte tabelle nimmt maximal fensterbreite ein.

Habe ich irgendwo etwas übersehen?

Gruss Matthias

[Detlef G.]

Hallo Matthias

Unter
http://www.synthas.ch/eplanung/static.html
könnt ihr ein Beispiel einer generierten Tabelle sehen. Ich möchte, dass alle Spalten eine gewisse Breite haben.

Was meinst du mit "gewisse Breite"?

Ein bestimmtes Pixelmaß, egal ob der Text reinpasst?
Dann gib eine Gesamtbreite für die Tabelle an.

Oder soll einfach nur genug Platz für den Zelleninhalt sein?
Dann lass overflow:hidden weg.

Oder soll in bestimmten Zellen der Text nicht umbrochen werden?
Dann gib für die Zellen white-space:nowrap an.

Sobald sie breiter wird, beginnen die Browser daran herumzumurksen.

Bei Tabellen versuchen die Browser, diese optimal darzustellen, also möglichst ohne dass Querscrollen nötig ist, aber immer so breit, dass die Inhalte nicht abgeschnitten werden.

<td class="header">
Lass mich doch bitte ein th sein.

Warum blähst du den Quelltext mit solchen Unmassen an Klassen auf?
Gib die am häufigsten vorkommenden Eigenschaften für td an und verwende nur für die Zellen mit davon abweichenden Eigenschaften Klassen.

Auf Wiederlesen
Detlef

[mkaufman]

Hallo Detlef

Danke für deine Antwort. Die Headerzeile habe ich abgeändert.
Das Problem ist halt wirklich, dass auch die leeren spalten eine breite von ca 2.5 cm haben sollen. Somit wurde die Tabelle bei rund 18 spalten einfach viel breiter als die meisten fenster. Praktisch alle Browser haben nun einfach die leeren spalten zusammengequetscht damit es einigermassen passt. Ich habe auch ein leeres bild erzeugt und dieses in jede spalte gelegt. Das hat zwar den gewünschten effekt erzielt, aber die seite lässt sich nicht schlau drucken.

Also hab ich das Problem an der Wurzel gepackt und die Tabelle auf zwei seiten aufgeteilt, jetzt passt sie in jedes browserfenster...

Das chaos mit den Klassen stammt aus einem nachmittag lang herummurksen. Sicher wird die klasse "leerfeld" einer allgemeinen definition für <td> weichen um den sourcecode zu schmälern...

Nochmals vielen Dank
Matthias

[Kalle_B]

Hallo,

Ich habe auch ein leeres bild erzeugt und dieses in jede spalte gelegt. Das hat zwar den gewünschten effekt erzielt, aber die seite lässt sich nicht schlau drucken.

Du kennst die Möglichkeit, per CSS speziell für den Druck eine kleinere Schriftgröße anzugeben?

Kalle

[mkaufman]

Hallo Kalle

Ich habe auch ein leeres bild erzeugt und dieses in jede spalte gelegt. Das hat zwar den gewünschten effekt erzielt, aber die seite lässt sich nicht schlau drucken.

Du kennst die Möglichkeit, per CSS speziell für den Druck eine kleinere Schriftgröße anzugeben?

Ja, kenne ich. Aber die tabelle ist so breit, dass sie mit lesbarer schrift eh nicht auf eine seite passt. Und ich habe gemerkt, dass das drucken von solch überbreiten Tabellen ein problem ist. Man erhält dann halbierte spalten und solches. Jetzt mit der Aufteilung auf zwei seiten ist zwar die Bedienung etwas weniger intuitiv, aber dafür schauts normal aus.

Gruss Matthias

[Kalle_B]

Hallo,

Ich möchte, dass alle Spalten eine gewisse Breite haben.

Gewisse Browser kümmern sich nicht um Breitenangaben, ignorieren CSS- Einträge wie width, min-width oder max-width.

Aber Bilder stellen sie in der vorgeschriebenen Breite dar. Und das kann man nutzen. Nimm ein transparentes Bild, z.B. http://www.osmer.de/img/transp.gif und gib ihm die gewünschte Breite pro Tabellen-Spalte:

<tr>
  <td><img src='transp.gif' height=1 width=450></td>
  <td>...</td>
</tr>

In der Summe der Pixel sollte die Tabelle wie gewünscht über das Fenster hinauswachsen.

Lieben Gruß, Kalle