Tabelle innerhalb eines Akkordeon seitlich skrollen

[eisenherz]

Hallo !

Ich möchte gern diese Tabellen in ein Akkordeon packen.

Leider verlieren sie dann die Funktion seitlich scrollbar zu sein ... und damit sind sie nicht voll einsehbar.

Gibt es dafür eine Lösung?

[ciaobello]

Versuche die Titel der Tabellen Vertikal zu schreiben. Du gewinnst dadurch viel Platz und ein Scrollen ist möglicherweise nicht mehr nötig.

[mlweb]

Falls, die Lösung von @ciaobello nicht reicht für das umgebende div mit der Klasse ce-table ein overflow-x: scroll vergeben. Aber beachte, dass das dann für alle Elemente innerhalb der Klasse gilt. Es werden also ggf. auch lange Überschriften gescrollt. Falls das ein Problem darstellt, die Überschriften als eigenständiges Element integrieren.

[eisenherz]

Versuche die Titel der Tabellen Vertikal zu schreiben. Du gewinnst dadurch viel Platz und ein Scrollen ist möglicherweise nicht mehr nötig.

Die Tabellen sind ja noch nicht voll...es ist ja erst das erste Rennen gelaufen. Zum Schluss wird Deine Idee vermutlich nicht reichen, was die Breite angeht.

[eisenherz]

Falls, die Lösung von @ciaobello nicht reicht für das umgebende div mit der Klasse ce-table ein overflow-x: scroll vergeben. Aber beachte, dass das dann für alle Elemente innerhalb der Klasse gilt. Es werden also ggf. auch lange Überschriften gescrollt. Falls das ein Problem darstellt, die Überschriften als eigenständiges Element integrieren.

wo finde ich ce-table?
im main css finde ich nur

main.css:500: table {
main.css:507: table th,
main.css:508: table td {
main.css:511: table th {
main.css:516: table td {
main.css:521: table thead tr {
main.css:527: table tfoot tr {
main.css:955: 	display: table;
main.css:959: 	display: table;
main.css:976: 	display: table;
main.css:980: 	display: table;
main.css:1399: 	display: table;
main.css:1403: 	display: table;
main.css:1505: .main-content table,
main.css:1744: .sidebar table,
main.css:2469: 	display: table;
main.css:2473: 	display: table;
main.css:2856: 	display: table;
main.css:2861: 	display: table;
main.css:3367: 	display: table;
main.css:3371: 	display: table;
main.css:3578: 	display: table;
main.css:3582: 	display: table;
main.css:4337: .mod_login table {
main.css:4342: .mod_login table td {

[kos]

Du kannst doch dem Inhaltselement eine Klasse (z.B. scrollable) mitgeben und dann die Tabelle mit einer eigenen CSS-Anweisung wie

ce-table.scrollable{
  overflow-x: scroll
}

ansprechen.

[mlweb]

Entweder so wie @Kos geschrieben hat, mit einer zusätzlichen Klasse oder die Klasse .ce_table nutzen. Wenn diese in Deiner css-Datei noch nicht vorhanden ist, kannst Du Sie einfach einfügen.