最大高度不在桌子上工作

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,但是我正在使用,因为我为了更好的测试目的而显示).

我最初只用一个外表尝试它,但布局比我在这里显示的稍微复杂一些,所以单个外表没有按需显示.

但我需要的是知道如何使最大高度防止<tr>,<td>或<table>从伸展.

任何帮助是极大的赞赏.

Answer 1

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