Warum Tabellen für Layouts manchmal besser als CSS sind

[Die_Antwort]

Moin!

Arbeiten wir mal Details heraus. Und Widersprüche deiner Layout-Forderungen.

Zunächst mal die vertikale Ausdehnung.

Deine Forderung für die Spalten:
Spalte 2: "mindestens so groß wie die Navigation"
Spalten 3 und 5: "Sie sind zusätzlich immer gleich hoch"
Spalte 4: "hat eine feste Höhe", aber dann auch "mindestens so hoch wie der Viewport (minus der Höhe des Footers), wird aber größer, wenn die zweite Spalte von links größer als 100% des Viewports wird."
Daraus folgt für Spalte 1 dann eigentlich: Höhe so hoch, wie Inhalt da ist.

Da frage ich mich ja schon, wie du dieses Höhenchaos mit Tabellen hinkriegen willst, selbst wenn man der Einfachheit halber annimmt, die Breite jeder Spalte soll einfach nur 20% sein. Allein schon die Kombination der Höhe der Spalten 3 bis 5 dürfte extrem schwierig hinzukriegen sein.

Abgesehen davon sind Forderungen wie beispielsweise "feste Höhe" (welche) und "wird größer" natürlich widersprüchlich.

Sorry, "fest Höhe" = "Mindesthöhe"

Ebenso ist nicht definiert, wie sich denn diese Spalte verhält, wenn sie mehr Inhalt darstellen muß, als alle anderen Spalten.

Wie meinst du das?

Dann zu der horizontalen Ausdehnung:
Spalte 1: "nur so breit wie der längste Inhalt"
Spalte 2: "den kompletten restlichen horizontalen Platz" (wobei der Rest als letztes übrigbleibt, wenn alle anderen Spalten ihren Platz haben)
Spalte 3 und 5: "sind immer gleich breit (so breit wie die breitere von beiden). Die Breite hängt wieder ausschließlich vom Inhalt ab."
Spalte 4: "eine vom Inhalt abhängige variable Breite"

Mit diesen Definitionen ist es möglich und legitim, der Spalte 2 genau einen Pixel Breite geben zu lassen, sofern alle anderen Spalten einfach nur ungünstigen Inhalt haben. Ein Pixel wäre ein gültiger "Rest".

Jep.

Die breite von Spalte 1 wird 100% erreichen, sofern ihr Inhalt sehr lang ist. Ein einfacher Textabsatz, der mehr als eine Zeile umfasst, reicht da schon aus. Oder was ist unter "der längste Inhalt" zu verstehen?

Bei Leerzeichen wird der Text umgebrochen. Falls dort aber ein großes Blockelement ist, dann hast du Recht.

Summa summarum stellst du hier ein Sammelsurium von Layoutforderungen auf, die du dir selbst vermutlich noch nie optisch und "mechanisch" vorgestellt hast.

Diese abstruse Konstruktion dann zur Argumentation "pro Tabellenlayout" zu verwenden ist daher mehr als haarsträubend.

Nun, ich vermute man kann es mit Tabellen _eher_ teilweise realisieren als mit CSS alleine.

Für die dynamische Breite gilt ansonsten dasselbe, wie für die Navigation. Abgesehen davon würde mich sehr interessieren, wie du die Forderung nach "gleichbreite dynamische Breite" mit Tabellen realisiert kriegst. :) Ich will nicht behaupten, dass es unmöglich ist - aber ich halte es für den Knackpunkt dieser Idee.

Ich gebe einer Spalte eine Breite von "50%" und der anderen die Breite "*". Das erfordert aber beim Ändern wieder Eingriffe in den Quellcode. Dennoch funktioniert es immerhin.

Hey, News aus der Realität: Eine Breite "*" gibts nicht für Tabellenspalten, und sofern du sie in <colgroup> einsetzen wolltest: Das funktioniert nur im Firefox, und sonst nirgendwo.

???

  
<table style=";">  
<tr>  
 <td valign="top" style="background:red;" width="50%">123456789</td>  
 <td style="background:blue;" width="*">123</td>  
</tr>  
</table>  

Funktioniert auch in Opera wunderbar. Natürlich ist das ganze ganz böse per inline formatiert. Aber es funktioniert. Mit CSS geht's gar nicht.

6. Innerhalb der Navigation (erste Spalte von links) befinden sich zwei weitere Container. Sie haben eine feste Höhe, aber keine feste Breite (wieder Inhaltsabhängig) und ihr Inhalt (sowohl gefloatete Block-Elemente als auch Inline-Elemente) ist vertikal zentriert.

Was soll das genau sein? Sinn? Inhalt?

Ich habe nur versucht auf die schnelle ein Beispiel zu konstruieren, was die Problematik der verikalen Zentrierung von Blockelementen in CSS aufzeigen sollte.

Mal wieder Realitätscheck: Will man wirklich vertikal zentrieren, wenn die Layoutforderungen so extrem sind. Immerhin soll die Navigationsspalte ja wohl so hoch werden, wie Inhalt in Spalte 2 da ist. Aber welchen Sinn hat es, eine Navigation zu haben, die durch vertikale Zentrierung erst auf der zweiten Bildschirmseite zu sehen ist, weil der Inhalt insgesamt drei Bildschirmseiten lang ist?

Das ganze ist natürlich sinnfrei. Ich wollte doch nur zeigen, welche Probleme es gibt. =*(

Man kann mit CSS auch vertikal zentrieren. Dort, wo es sinnvoll ist.

Ja, man braucht 3 Hilfselemente. Ich musste das mal auf einer Seite machen, wo Bilder einer Bildergallerie vertikal ohne Tabelle zu zentrieren waren. Schrecklich.

Niemand, der sich um das optische Erscheinungsbild seines Schriftwerkes Gedanken macht, schreibt so, wie er denkt.

Auch - oder vielleicht sogar besonders - die Autoren von Druckwerken wie Büchern, Zeitschriften und Zeitungen schreiben zuerst so, wie sie denken, und überarbeiten ihren Text dann mehrfach so, dass er ins Layout paßt.

Die Armen. Das liegt doch aber vermutlich eher daran, dass es eben teuer ist, wenn nicht alles ganz genau passt (dann wird's ne Seite mehr, das kostet). Im Internet haben wir dieses Problem zum Glück nicht.