Kommentare zu: CSS Table Header Fixed – thead einer Tabelle fixieren

Von: Alan

Alan — Wed, 26 Oct 2022 09:12:04 +0000

@Rollo: das kann auch nicht klappen, weil du mit deinen Echo s nur deinen Text ausgiebst.. und keine html Syntax. Da klappen dann auch keine Stylesheets.

Von: derSESO

derSESO — Thu, 23 Jun 2022 08:07:44 +0000

Als Antwort auf Doberfrau.

Hallo,
gibt es eine Lösung dafür?
habe auch einen Tabellenkopf über zwei Zeilen und die zweite Zeile mag er nicht. 🙁

Von: admin

admin — Thu, 02 Jun 2022 09:55:17 +0000

Als Antwort auf Rollo.

Hey Rollo,

was soll ich dir sagen ohne deinen Code zu sehen. In meinem Beispiel funktioniert es. Schreib mir eine E-Mail. Vielleicht kann ich dir helfen.

LG Oli

Von: Rollo

Rollo — Fri, 20 May 2022 18:05:41 +0000

Hallo,
ich habe das Beispiel ausprobiert, aber ohne Erfolg. Wie auch schon vorher dutzend andere.
Ich bekomme es einfach nicht hin, dass der Tabellenkopf fest steht und nur der Inhalt scrollt.
Hier ist einmal der Auszug Stylesheet und die Tabellenerzeugung.
Hat jemand noch eine Idee, warum das nicht funktioniert?

Mein Code:
echo „“;
div.wrapper {
padding: 20px;
display: block;
overflow: auto;
}
table.scroll {
width: 100%;
background-color: #fff;
}
table.scroll thead {
width: 100%;
background: #5dd39e;
}
table.scroll thead tr:after {
content: “;
overflow-y: scroll;
visibility: hidden;
}
table.scroll thead th {
flex: 1 auto;
display: block;
color: #fff;
}
table.scroll tbody {
display: block;
width: 100%;
overflow-y: auto;
height: auto;
max-height: 200px;
}
table.scroll thead tr,
table.scroll tbody tr {
display: flex;
}
table.scroll tbody tr td {
flex: 1 auto;
word-wrap: break;
}
table.scroll thead tr th,
table.scroll tbody tr td {
width: 25%;
padding: 5px;
text-align-left;
border-bottom: 1px solid #eee;
}
„;

// —————————————————
// Ausgabe-Tabelle wenn Datensätze vorhanden
// —————————————————
if ($row_cnt > 0) {
echo „“;
echo „“;
echo „“;
echo „“;
echo „“;
printf(„Folgende %d Einträge wurden gefunden\n“, $row_cnt);
if (!(Empty($suchinterpret)) And (Empty($suchalbum)) )
{
echo „für Interpret: “ . $sinterpret . „“;
}
if (!(Empty($suchalbum)) And (Empty($suchinterpret)) )
{
echo „für Album: „, $stitel, „“;
}
if (!(Empty($suchinterpret)) And !(Empty($suchalbum)) )
{
echo „für Interpret: „, $sinterpret, „“;
echo „und Album: „, $salbum, „“;
}
echo „“;
echo „“;
echo „“;
echo „Interpret„;
echo „Album„;
echo „Anzahl„;
echo „Medium„;
echo „Cover„;
echo „Label„;
echo „Best-Nr„;
echo „Abgeben„;
echo „Aktion„;
echo „“;
echo „“;
echo „“;
// ———————–
// Ausgabe-Tabelle Daten
// ———————–

while ($row = mysqli_fetch_object ($result))
{
echo „“;
$row->Interpret = htmlentities($row->Interpret);
if (empty($row->Interpret)) $row->Interpret = „“;
echo „“, $row->Interpret, „“;
if (empty($row->Album)) $row->Album = „“;
echo „“, $row->Album, „“;
if (empty($row->Anzahl)) $row->Anzahl = „“;
echo „“, $row->Anzahl, „“;
if (empty($row->Medium)) $row->Medium = „“;
echo „“, $row->Medium, „“;
if (empty($row->Cover)) $row->Cover = „“;
echo „“, $row->Cover, „“;
if (empty($row->Label)) $row->Label = „“;
echo „“, $row->Label, „“;
if (empty($row->BestNr)) $row->BestNr = „“;
echo „“, $row->BestNr, „“;
if (empty($row->Abgeben)) $row->Abgeben = „“;
echo „“, $row->Abgeben, „“;
echo “

Cover>
Album>

„;
echo „“;
}
echo „“;
echo „“;
echo „“;

Von: rahrens@t-online.de

rahrens@t-online.de — Wed, 18 May 2022 17:13:39 +0000

Ich bekomme die Umsetzung auf mein Beispiel nicht zum Laufen.
Ich habe eine Musiktabelle mit mehreren Tausend Einträgen.
Die nachfolgenden Beiden Zeilen sind der Kopf, der beim Scrollen stehen bleiben soll.
Ich habe schon diverse Einträge aus verschiedenen Foren probiert, aber immer mit dem Erfolg, dass die Ganze Tabelle incl Kopf scrollt.

Folgende 800 Einträge wurden gefunden für Interpret: Barber
Interpret Album Anzahl Medium Cover Label Best-Nr Abgeben Aktion

Über Hilfe, würde ich mich sehr freuen, da ich langsam nicht mehr weiter weiss.

Mfg rahrens@t-online.de

Von: admin

admin — Wed, 18 May 2022 08:07:28 +0000

Als Antwort auf sedistok.

Hey sedistok,

und dennoch haben Tabellen Ihre Daseinsberechtigungen und anscheinend hast du meinen Beitrag ja irgendwie gefunden 😉

LG Oli

Von: sedistok

sedistok — Tue, 17 May 2022 16:42:25 +0000

Als Antwort auf Doberfrau.

. . . bekannter Softwareentwickler-Spruch: „we are proud to be, completely Table-Free“.
Gemeint ist: „tables“ sind etwas für html-Frickler, nichts für Programmierer.

Von: Doberfrau

Doberfrau — Wed, 22 Jul 2020 09:10:48 +0000

Funktioniert ausgezeichnet, solange man nicht mit colspan oder rowspan arbeiten muss – dann zerschießt es erwartungsgemäß wieder alles. Wie einfach wäre es, wenn mit HTML5 endlich das schon seit ewigen Zeiten angeforderte Attribut für thead umgesetzt wäre, mit dem man den Header einer Tabelle fixieren könnte, unabhängig davon, wie man den Body aufbaut. Tabellenkalkulationen zeigen seit inzwischen mehr als 25 Jahren, dass das geht …

Von: JOSE H

JOSE H — Wed, 09 Oct 2019 20:31:23 +0000

Spanisch (Original): Agregar esta seccion al CSS para que el texto no se desborde de las columnas

Deutsch (Übersetzung): Fügen Sie diesen Abschnitt zum CSS hinzu, damit der Text nicht aus den Spalten überläuft.

table.fixed_header{
-ms-word-break: break-all;
word-break: break-all;
word-break: break-word;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
}

Von: admin

admin — Thu, 19 Sep 2019 13:48:09 +0000

Als Antwort auf Claus.

Hi Claus,

danke für dein Kommentar & deine Anregung. Ich habe deine Anmerkungen in meinem obigen Beispiel hinzugefügt.

Lg Oli