thead fixed

[Linuchs]

Moin,

beim Scrollen von Tabellen verschwindet die Überschrift.

Nun habe ich mal ausprobiert:

thead {
  position: fixed;
  left: 0;
  top: 0;
}

Tatsächlich hockt thead im FF jetzt fixiert links oben, hat also die Tabelle verlassen und auch die Spaltenbreiten verloren.

Vor Jahren hatte ich zwei theads - Original und Kopie - und der Kopie per Jacascript die Spaltenbreiten des Originals verpasst. Dann beim Scrollen verfolgt, ob das Original den oberen Rand erreicht hat. Wenn ja, Kopie fixiert. Fixierung wieder aufgehoben beim Runterscrollen.

Problem: Die Kopie muss im Vordergrund stehen und bei sortierbaren Tabellen wirkt ein Klick auf die Kopie nicht.

Also umständlich bis unmöglich. Gibt es inzwischen eine reine CSS-Lösung?

Linuchs

[Auge]

Hallo

position: sticky;

Wie das Wiki auch schon eine ganze Weile weiß. Und wenn du jetzt auf die wenigen Browser, die diese CSS-Eigenschaft nicht unterstützen, hinweisen willst: Who cares? Für die ändert sich gegenüber dem jetzigen Zustand nichts. Deren Nutzer werden also keinen Unterschied bemerken. Die Nutzer der anderen Browser aber sehr wohl.

Progressive Enhancement bei der Arbeit.

Tschö, Auge

[Linuchs]

position: sticky;

Leider reagiert der FF 48.0 (Linux, Aktualisierung automatisch) nicht drauf.

Linuchs

[Auge]

Hallo

position: sticky;

Leider reagiert der FF 48.0 (Linux, Aktualisierung automatisch) nicht drauf.

Der Firefox unterstützt das seit Version 26/32 (zuerst nur über Aktivierung per about:config). Wie ich auf der Sticky-Seite auf caniuse.com gerade unter „Known Issues“ lese, tut er es nicht bei table headers. Bis jetzt also doch nichts für deinen Zweck.

Die Kommentare im Bugreport für Firefox lassen erahnen, dass das kein triviales Problem ist und nicht nur den Firefox betrifft. Im Chromium war die Funktion drin und wurde wieder herausgenommen. Die Bugs, von denen laut Bugreport die Lösung des Problems abhängt, sind aber mittlerweile alle behoben (siehe auch den Kommentar vom 5.5.2017).

Tschö, Auge

[Linuchs]

es gibt den FF 53.0

Habe ich heruntergeladen "öffnen mit Archivverwaltung"

Beim Entpacken wird nach einem Ordner gefragt.

Keine Ahnung - welcher ist es?

Der Ordner / wird vorgeschlagen, aber beim Öffnen vom FF habe ich nach wie vor Version 48.0

Linuchs

[MudGuard]

Hi,

beim Scrollen von Tabellen verschwindet die Überschrift.

also müßte m.E. der tbody eine maximale Höhe und ein overflow(-y): scroll bekommen. Ob das funktioniert, hab ich jetzt nicht ausprobiert.

Wenn thead fixiert würde, würde der ja auch an seiner Stelle stehenbleiben, wenn man durch den Rest der Seite nach der Tabelle durchscrollt.

cu,
Andreas a/k/a MudGuard

[Gunnar Bittersmann]

@@Linuchs

Also umständlich bis unmöglich. Gibt es inzwischen eine reine CSS-Lösung?

Keine Ahnung, warum Browser tbody { max-height: 10em; overflow: auto } nicht unterstützen. :-(

Ich hab vor einiger Zeit mal was gebastelt.

LLAP 🖖

[marctrix]

Hej Gunnar,

@@Linuchs

Ich hab vor einiger Zeit mal was gebastelt.

So wäre mein Ansatz auch gewesen. Aber eine Frage: warum max-width?

Marc

[marctrix]

Hej Gunnar,

Ich hab vor einiger Zeit mal was gebastelt.

Ich würde noch ein max-heigth: 100vh für die Tabelle ergänzen…

Marc