最大高度不在桌子上工作

Question

在我的網站上，在某些頁面上，有一個列出一些信息的框表。 如果要顯示6個項目，那么包含信息的表格單元格應該有一個滾動條 - 單元格不應該展開。

所以，我有以下布局：

<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>

但是，不幸的是，這導致了一個更大的盒子，可以為每個添加的新項目保持拉伸。 如果它有足夠的物品。 （更新完成后，我將使用CSS，並使用overflow-y:auto ，但我正在使用，因為我為了更好的測試目的而顯示）。

我最初只用一個外表嘗試它，但布局比我在這里顯示的稍微復雜一些，所以單個外表沒有按需顯示。

但我需要知道如何使max-height阻止<tr> ， <td>或<table>拉伸。

任何幫助是極大的贊賞。

Answer 1

我在最外面的<td>添加了一個<div <td> ：

<table> //this contains multiple boxes for different topics
    <tr> //this contains one topic of info
       <td> //This contains one topic of info
         <div style="overflow-y:scroll;max-height:200px;">
           <table> //contains one topic with several items