Axel Richter: display:table-cell spaltenübergreifend

Beitrag lesen

Hallo,

Der eigentliche Trick ist das Herauslösen der Table-Cell aus dem normalen Elementfluss mit position:absolute.
span.colspan {position:absolute; white-space:nowrap;}
Hm, umbrechen sollte es schon dürfen ;-)

Das wird nicht funktionieren.[1]

Wenn Du das Element innerhalb der Tabellenstruktur belassen willst und es soll trotzdem über mehrere Spalten gehen, benötigst Du ein colspan, also eine HTML-Tabelle.

Löst Du es, egal wie, aus der Tabellenstruktur heraus, kannst Du nicht erwarten, dass sich die Tabellenstruktur noch um das Element kümmert oder das Element sich noch an der Tabellenbreite orientiert. Das musst Du dann irgendwie selbst tun, also das herausgelöste Element so breit machen wie nötig und die Zeile, über der Du das herausgelöste Element positionierst, so hoch machen wie nötig.

Brichst Du die Tabelle ab, um das Element einzufügen, dann orientiert sich natürlich die nachfolgende Tabelle nicht mehr an den Spaltenbreiten der abgebrochenen Tabelle. Die Spaltenbreiten müssten feststehen, was die display:table*-Eigenschaften unsinnig machen würde, da man dann gleich alle Elemente floaten lassen könnte.

Ergo:
Entweder es gibt irgendwann colspan via CSS oder es kommt nur eine float-Lösung in Frage. Bei letzterer müssen natürlich die Spaltenbreiten auch feststehen.

[1] Die Erkenntnis, das etwas, im Moment, nicht lösbar ist, ist ja auch eine Erkenntnis.

viele grüße

Axel