2012-03-17 1 views
8

私のサイトでは、特定のページにいくつかの情報をリストするボックスがあります。 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を使用しますが、より良いテスト目的のために表示されているように使用しています)。

私はもともと1つの外部テーブルで試しましたが、レイアウトはここに表示されているより少し複雑です。したがって、必要に応じて単一の外部テーブルが表示されませんでした。

しかし、私が必要とするのは、最大高さをどのようにして<tr>,<td>、または<table>が伸びないようにするかを知ることです。

ご協力いただきまして誠にありがとうございます。

+0

を私はG-ChromeとFirefoxでテストしてみました。 – Jakar

答えて

10

私は、最も外側の<td>内><divを追加しました:

<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 
関連する問題