Ergebnis 1 bis 5 von 5

Thema: Tabelle overflow scroll

  1. #1
    Meister(in) Avatar von lukasn
    Registriert seit
    23.02.2008
    Ort
    Schweiz
    Alter
    27
    Beiträge
    491
    Danke
    2
    Bekam 12 mal "Danke" in 11 Postings

    Standard Tabelle overflow scroll

    Hallo allerseits,

    Ich habe ein etwas nerviges Problem mit einer Datentabelle. Die Tabelle kann je nach Situation mehrere hundert Zeilen haben. Ich möchte deshalb den <tbody> scrollbar machen, <thead> und wenn möglich <tfoot> sollen dabei aber am Ort bleiben. Die offensichtliche Lösung, dem <tbody> eine fixe höhe und overflow:auto zu geben, funktioniert leider nicht. Ich habe auch versucht, tbody mit display: block und den obigen angaben zu versehen, aber dann funktioniert die Breite nicht mehr.

    Nach etwas googlen habe ich nur Lösungen gefunden, die entweder zusätzliches Markup oder Javascript verwenden. Beides Optionen, die ich bisher noch nicht in Betracht ziehen will.

    Wer weiss, vielleicht hat ja einer von euch eine Lösung parat.

    Danke im Voraus und Gruss,
    -Lukas
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    König(in)
    Registriert seit
    07.02.2009
    Ort
    Leipzig
    Beiträge
    1.391
    Danke
    2
    Bekam 21 mal "Danke" in 20 Postings

    Standard AW: Tabelle overflow scroll

    Deinen Wunsch habe ich auch vor einiger Zeit gehabt. Dummerweise ist es noch heute so, dass jeder Browser ein overflow von Tabellenelementen unterschiedlich behandelt. Firefox macht es imho noch am Besten, der IE jedoch gar nicht. Das zusätzliche Markup ist leider dafür notwendig, wobei ich den bisher einfachsten Weg über eine pure CSS-Lösung gefunden hatte, die jedoch auch zusätzliche Elemente erforderte. Allerdings klappt das nur bei einem feststehenden <thead>. Du willst aber offenbar auch <tfoot> festzurren, wobei ich mir unsicher bin, ob das überhaupt klappen würde.

  3. #3
    Teeny Avatar von styleshiet
    Registriert seit
    06.06.2012
    Beiträge
    49
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Tabelle overflow scroll

    Hallo Lucas
    ich hab mich vor einiger Zeit auch mit diesem Thema beschäftigt und folgende Lösung gefunden. Code und Klassennamen sind noch aus Testzeiten . Es sollte aber dein Problem lösen.
    Code:
    .tblbox{ 
    width:300px; 
    margin:50px; 
    border:1px solid black; 
    } 
     
    .scrlbox{ 
    width:100%; 
    height:65px; 
    overflow:auto; 
    } 
    table.tst { 
    width:100%; 
    border:1px solid #777; 
    padding:5px; 
    margin:0; 
    border-spacing:0; 
    text-align:center; 
    } 
    tr:nth-child(odd) {background-color:#fff; } 
    tr:nth-child(even) {background-color:#ddd; }
    HTML-Code:
    <div class="tblbox"> 
    <table class="tst" rules="all"> 
       <thead>     
       <tr> <th>No</th> <th>Bus-Linie</th> <th>Abfahrtzeiten</th> </tr> 
       </thead>     
    </table> 
    <div class="scrlbox"> 
    <table class="tst" rules="none"> 
       <tr> <td>1</td> <td>751</td>    <td>13:30</td> </tr> 
       <tr> <td>2</td> <td>752</td>    <td>13:40</td> </tr> 
       <tr> <td>3</td> <td>753</td>    <td>13:50</td> </tr> 
       <tr> <td>4</td> <td>754</td>    <td>14:00</td> </tr> 
       <tr> <td>5</td> <td>755</td>    <td>14:10</td> </tr> 
       <tr> <td>6</td> <td>756</td>    <td>14:20</td> </tr> 
       <tr> <td>7</td> <td>757</td>    <td>14:30</td> </tr> 
       <tr> <td>8</td> <td>758</td>    <td>14:40</td> </tr> 
       <tr> <td>9</td> <td>759</td>    <td>14:50</td> </tr> 
    </table> 
    </div> 
    </div> 
    Hoffentlich hilft es dir weiter. Viel Spass
    Stell dir vor es ist machbar, aber keiner kriegt's hin...

    CssApps.de

  4. #4
    Meister(in)
    Themenstarter
    Avatar von lukasn
    Registriert seit
    23.02.2008
    Ort
    Schweiz
    Alter
    27
    Beiträge
    491
    Danke
    2
    Bekam 12 mal "Danke" in 11 Postings

    Standard AW: Tabelle overflow scroll

    Hallo Styleshiet,

    Danke für die Antwort. Eine ähnliche Lösung verwende ich jetzt auch. Ich wollte ursprünglich wie gesagt vermeiden, zusätzliches Markup zu verwenden. Ich verwende nur im äussersten Notfall Markup, dass nur zu Darstellungszwecken da ist. Und Tabellen bieten von sich aus ja schon mehr als genug Elemente, dass man eigentlich auch ohne div-Salat klar kommen sollte. Aber Tabellen und CSS sind halt leider immer noch sehr unzuverlässige Partner...

    Gruss,
    -Lukas

  5. #5
    Unregistriert
    Gast

    Pfeil AW: Tabelle overflow scroll

    Auf langua.de haben wir dies folgendermaßen gelöst:

    Beispiele:

    http://langua.de/de/Wörterbuch

    Besonders Wert gelegt haben wir auf die Detailanzeige wenn man auf ein Suchergebnis klickt (das ist ein Mehrwert ggü. herkömlichen Wörterbüchern).

    Gern beantworte ich alle Fragen zu dem Wörterbuch.

    Soweit ich weiß ist die Site sogar W3C valid

Ähnliche Themen

  1. zentrieren von div/overflow
    Von Unregistriert im Forum HTML & CSS Forum
    Antworten: 24
    Letzter Beitrag: 17.09.2012, 11:02
  2. css overflow problem
    Von Serpico73 im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 04.08.2011, 16:46
  3. div- body- overflow
    Von Dicker1 im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 10.12.2008, 13:33
  4. overflow:visible in IE7
    Von Unregistriert im Forum HTML & CSS Forum
    Antworten: 0
    Letzter Beitrag: 29.09.2008, 18:23
  5. Overflow
    Von mgraf im Forum HTML & CSS Forum
    Antworten: 14
    Letzter Beitrag: 08.01.2007, 01:07

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •