標準模式下100％高度的嵌套表格

我想解決一些表格（嵌套）出現的顯示問題。總之，我們展示了一個列出產品的頁面。每個產品都顯示在自己的表格中。並且每個嵌套在一個更大的表格中以佈置頁面。不幸的是，一些內表的內容比其他內容略多，並且它們的大小不同，導致其他內容不能填充包含的單元格。標準模式下100％高度的嵌套表格

例如：

<table style="height:500px; background:blue;"> 
    <tr> 
     <td style="vertical-align: top"> 
      <table style="background:red; height: 100%;"> 
       <tr> 
        <td>hello</td> 
       </tr> 
      </table> 
     </td> 
    </tr> 
</table>

在怪癖模式，將紅表，填充藍色的桌子，所以你基本上看到一個紅色的表，藍色邊框。

但是，在標準模式下，內部表格不會展開以填充藍色表格。導致佈局完全不如預期。

我該如何解決這個問題？我不想渲染怪癖，因爲這最終會造成維護噩夢。

來源

2011-07-11 CaffGeek

我很好奇;你爲什麼要嵌套表格？如果你使用它們進行佈局，你不應該這樣做。 – You

由於沒有人說過，_tables不適合佈局，請不要使用它們。 :) – Nightfirecat

@Nightfirecat，我意識到這一點。不幸的是，我沒有寫這個代碼，只是試圖解決顯示問題。 – CaffGeek

把style="height: 100%;"放在<td>和<tr>的標籤上。將身高設置爲100％需要每個父母都有一個確定的身高。

來源

2011-07-11 17:57:22

這似乎適用於我的示例...但在實際頁面中，此表嵌套得非常深，改變父母高度始終是不切實際的。有另一種方法嗎？ – CaffGeek

對不起，我知道這很痛苦，但我從未找到任何其他方式。這是一個已知的問題，你可以找到很多網站在談論。唯一的其他選擇是在內部表格上設置px高度。 –

您只需要定義表格與100％之間的高度，直至使用px（或em或非％）的任何父級。除非它一直是％，否則你不必一路走到根。 –

不是設置外表的高度，而是在嵌套表上設置<td>和style="height: 100%;"的高度。

來源

2017-10-26 06:11:00 code4j

標準模式下100％高度的嵌套表格

回答

相關問題