Problem z przewijaniem na IE 9 (wysokość tbody = wysokość-linia)

Przepraszam za mój zły angielski, mam nadzieję, że zrozumiesz, co chcę powiedzieć ...

Usiłuję zaimplementować tabelę HTML, która obsługuje przewijanie obiektów tabeli niezależnie od głowy tabeli.

Znalazłem następujące pytanie, które bardzo mi pomogło:Jak przewijać „tbody” tabeli niezależnie od „thead”?

Przetestowałem poniższy kod, działa on na Chrome (22), Firefox (16) i Opera (12) bez problemu:

HTML:

<table>
  <thead>
   <tr>
    <th>Title1</th>
    <th>Title2</th>
    <!-- ... -->
   </tr>
  </thead>
  <tbody>
   <tr>
     <td>...</td>
     <td>...</td>
     <!-- ... -->
   </tr>
   <!-- ... -->
  </tbody>
</table>

CSS:

thead, tbody {
    display: block;
}

tbody {
    height:500px;
    overflow-y:auto;
    overflow-x:hidden;
}

thead {
    line-height: 20px;
}

Więc działa na głównych przeglądarkach z wyjątkiem IE 9, na IE mam pewne problemy:

Wysokość tbody nie jest zdefiniowana (więc nie mam żadnego paska przewijania)Każda z nich ma wysokość 500px (wysokość tbody w innych przeglądarkach)

Dwa następujące przykłady mają dokładnie te same problemy:http://jsfiddle.net/nyCKE/2/ , http://www.imaputz.com/cssStuff/bigFourVersion.html

Widziałem następujące pytanie (i odpowiedź), ale to mi nie pomaga:IE9 + css: problem ze stałą tabelą nagłówków

Jestem pewien, że błąd pochodzi z IE, ale nie mam pojęcia, jak to naprawić bez zmiany struktury HTML.

Masz jakiś pomysł?

questionAnswers(2)

yourAnswerToTheQuestion