• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Tabelle - tbody scrollable

scbawik

Senior HTML'ler
Hallo !

Ich habe folgende Tabelle:

HTML:
<table>    <thead>        <tr>            <th>ID</th>            <th>Typ</th>            <th>Name</th>            <th>Strasse</th>            <th>Nr.</th>            <th>Land</th>            <th>PLZ</th>            <th>Ort</th>        </tr>    </thead>    <tbody>        <tr>            <td>32</td>            <td>Person</td>            <td>Max Mustermann</td>            <td>Musterstrasse</td>            <td>11</td>            <td>DE</td>            <td>12345</td>            <td>Musterstadt</td>        </tr>    </tbody></table>

Da diese über 100 Records enthalten kann, möchte ich ab einer max-height einen Scrollbalken anzeigen lassen.
Allerdings nur für den tbody, nicht für die ganze Tabelle.

Ich habe zwar ein paar Lösungen via Google gefunden, aber keine die mir ansatzweise zusagt.
Entweder verlaufen thead und tbody nicht mehr parallel, die Tabelle verliert ihre natürlichen Eigenschaften da man sie in Block-Elemente umwandeln muss (Automatische Spaltenbreiten gehen anscheinend verloren) oder es bringt sonstige Nachteile mit sich.

Gibt es wirklich keine CSS Lösung bei der die Tabelle anschließend auch noch Tabelle ist und sich vor allem auch wie eine verhält?

Hoffe ihr kennt da eine gute Lösung. Wichtig ist mir eigentlich nur dass sich die Tabelle weiterhin 'normal' verhält, als ob nichts wäre.

Danke schonmal!

SO: Da unser geschätztes, hochqualitatives Forum es immer noch nicht schafft Code direkt zu übernehmen und es mir jetzt echt zu blöde wird jeden Quellcode 2x in die Hand zu nehmen, werde ich das in Zukunft wohl anders machen: http://jsfiddle.net/KeWvM/
 
Zuletzt bearbeitet:
Danke, darauf bin ich aber auch schon gestoßen.

Leider ist die Lösung für mich nicht zufriedenstellend da bei fehlendem Scrollbalken (Mac OS, iOS, Android) die Spalten von thead und tbody nicht übereinstimmen ( = Nicht Cross-Browser kompatibel). Auch die 'Bullet-Proof' Version wird nicht korrekt angezeigt.

Und da ich denke (und hoffe) dass bald alle Browser auf den sichtbaren Scrollbalken verzichten, sehe ich diese Lösung nicht als zukunftsorientiert.

Trotzdem Danke.
 
Zurück
Oben