max-hauteur ne fonctionne pas sur la table

Sur mon site, sur certaines pages, il y a un tableau de cases qui liste quelques infos. Si il y a dire 6 éléments à afficher, puis la cellule du tableau contenant l'info devrait avoir une barre de défilement - la cellule ne doit PAS s'étendre.

Donc, j'ai de la mise en page suivante:

<table style="overflow-y:scroll"> //this contains multiple boxes for different topics
    <tr style="overflow-y:scroll;max-height:200px;"> //this contains one topic of info
       <td style="overflow-y:scroll;max-height:200px;"> //This contains one topic of info
           <table style="overflow-y:scroll;max-height:200px;"> //contains one topic with several items
              <tr><td>OneItem</td></tr>
              <tr><td>AnotherItem</td></tr> (and say, this goes on for 10 items)
           </table>
       </td>
    </tr>
  //the outermost <tr> would repeat itself here, say 5 times for each of a few different topics.
</table>

Mais cela, malheureusement, les résultats dans une boîte plus grande que la garde d'étirement pour chaque nouvel élément ajouté. si elle dispose de suffisamment d'éléments. (lors de la mise à jour est terminée, je vais utiliser les CSS, et overflow-y:auto, mais je suis en utilisant comme je l'ai affiché pour une meilleure des fins de test).

Et je l'ai fait à l'origine de l'essayer avec une seule table externe, mais la mise en page est un peu plus complexe que ce que j'ai affiché ici, aussi, la table externe ne s'affiche pas en tant que de besoin.

Mais ce dont j'ai besoin c'est de savoir comment en tirer le maximum de la hauteur de prévenir la <tr>,<td>, ou <table> d'étirement.

Toute aide est grandement appréciée.

OriginalL'auteur Reed | 2012-03-17