Responsive Tabellen

[c.stege]

Halloo,

wie macht ihr responsive Tabellen?
Ich habe überlegt das integrierte Tabellen-Modul zu nehmen, da hier jedermann einfache Inhaltsanpassungen vornehmen kann.
Leider ist diese nicht responsiv, welchen Weg wählt ihr?

Gruß

[Kopfnuss]

Bei Tabellen mit zwei Spalten lasse ich die Spalten ab einem Breakpoint einfach umbrechen.
Bei Tabellen mit mehr Spalten verwende ich diese Methode:

https://allthingssmitty.com/2016/10/03/responsive-table-layout/

Dabei wird einfach der Tabellenkopf in jede Zelle mit einem "data-attribut" geschrieben. Dafür muss man das Tabellen-Template anpassen.

[conter]

Wenn ich mehrere Tabellen ähnlicher Art zu erstellen hatte, habe ich mit Rocksolid Custom Elements gearbeitet.
Da habe ich bei der HTML/CSS-Ausgabe freie Hand und kann gleichzeitig die CMS-Felder für den Kunden passend anlegen.

[lucina]

Gerne benutze ich das Tabellen-Element vom Core, lade eine Bibliothek wie DataTables hinzu und passe das Template entsprechend der Bedarfe an.

[BennyBorn]

Ja da gibts je nach Fall verschiedene Lösungen

• "Stumpfes" umbrechen
• In jedes TD nochmal ein unsichtbares Label reinpacken für die mobile Ansicht
• Tabellen klein skalieren damit sie komplett in den Viewport passen und dann ggf. per Klick reinzoomen
• etc.

In 90% der Fälle kommt aber immer das Tabellen-Inhaltslement des Cores zum Einsatz.