sticky thead verliert border

[Gunnar Bittersmann]

@@Linuchs

Kopfzellen sind nicht mit <td>, sondern mit <th> auszuzeichnen.

Das Prinzip ist mir bekannt, ich nehme td, weil text-align der Spalten-Überschrift identisch sein soll wie in den Zeilen.

Das Prinzip von HTML scheint dir noch nicht bekannt zu sein. Du musst HTML-Elementtypen grundsätzlich nach der Art des Inhalts wählen; nicht nach der gewünschten Darstellung.

Wenn Kopfzellen als solche mit <th> ausgezeichnet sind, sollten auch Screenreader-Nutzer eine angemessene Ansage der Tabelle vorgelesen bekommen.

Bei th muss ich das zusätzlich definieren.

Ja, wenn dir die Default-Einstellungen der Browser nicht passen, dann überschreibst du diese in deinem Stylesheet. Dafür ist CSS ja da.

Mir passen bei Tabellen die Default-Einstellungen auch nicht. Deshalb steht im Stylesheet eben sowas wie

table {
  border-collapse: collapse;
  font-variant-numeric: lining-nums tabular-nums;
}

th, td {
  text-align: start;
  vertical-align: top;
  font-weight: normal;
}

---

Habe im thead th gesetzt

Gut so.

beim FF bleibt der Fehler.

Hatte ich irgendwo gesagt, dass die Auszeichnung als <th> das Problem mit der verschwindenden Linie aus der Welt schafft? Nein, das hatte ich nicht! Hatte ich Pseudoelemente erwähnt? Ja, das hatte ich!

Schau dir bitte die verlinkten Beispiele an. Und nein, sie sind nicht leer.

(Ich habe noch den einen Link korrigiert. Vorher führten beide zum selben Codepen.)

Wie ist's beim Chrome?

Warum fragst du und testest nicht selbst?

🖖 Живіть довго і процвітайте