我可以使用表格，tr或td的最小高度嗎？

我希望該表有最小高度來顯示產品。所以如果只有一種產品，那麼表格最後至少會有一些空白。另一方面，如果有5個或更多的產品，它不會是空的空間。

我嘗試用這個CSS：

table,td,tr{ 
    min-height:300px; 
}

但它無法正常工作。

在此先感謝。

來源

2013-10-17 kilkadg

如果您爲我們創建一個小提琴來嘗試您的代碼將會很有幫助。 – mavrosxristoforos

這不是一個很好的解決方案，但嘗試這樣的：

<table> 
    <tr> 
     <td> 
      <div>Lorem</div> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <div>Ipsum</div> 
     </td> 
    </tr> 
</table>

和的div設置爲最小高度：

div { 
    min-height: 300px; 
}

希望這是你想要的...

來源

2013-10-17 16:28:49

@SackySan你需要給divs類，然後使這個規則適用於該類只 –

在CSS 2.1中，表「內聯表，表格單元格，錶行和行組」中的'min-height'和'max-height'的效果未定義。

所以儘量包裹在一個div的內容，並給DIV一個min-height jsFiddle here

<table cellspacing="0" cellpadding="0" border="0" style="width:300px"> 
    <tbody> 
     <tr> 
      <td> 
       <div style="min-height: 100px; background-color: #ccc"> 
       Hello World ! 
       </div> 
      </td> 
      <td> 
       <div style="min-height: 100px; background-color: #f00"> 
       Goog MOrning ! 
       </div> 
      </td> 
     </tr> 
    </tbody> 
</table>

來源

2013-10-17 16:31:07

222

height爲td作品像min-height

http://fiddle.jshell.net/qz70zps4/

來源

2014-08-15 15:11:53

你是對的！真棒！ –

+42

我投票改變這個解決方案爲正確的。 – Luke

在我運行Windows 7的谷歌瀏覽器（版本47.0.2526.106米）中，我發現設置'td'的'height'實際上是作爲'padding'的頂部和底部處理的，這可能會引入一些佈局問題，你認爲這真的是一個「高度」空間。它不會在開發工具中顯示爲風格或計算風格，但是當您將鼠標放在檢查過的html元素上時，它會顯示在屏幕上。 –

，如果你設置樣式= 「高度：100像素;」在td上，如果td包含的內容比單元更多，那麼td上就不需要最小高度。

來源

2015-07-15 21:59:37 frank

沒有div的解決方案使用僞元素，如::after，首先td行min-height。保存您的HTML清潔。

table tr td:first-child::after { 
    content: ""; 
    display: inline-block; 
    vertical-align: top; 
    min-height: 60px; 
}

來源

2016-05-09 12:07:06 omelniz

只需將min高度的css條目應用到表格行的其中一個單元格中。也適用於舊版瀏覽器。

.rowNumberColumn { 
    background-color: #e6e6e6; 
    min-height: 22; 
} 

<table width="100%" cellspacing="0" class="htmlgrid-table"> 
    <tr id="tr_0"> 
      <td width="3%" align="center" class="readOnlyCell rowNumberColumn">1</td> 
      <td align="left" width="40%" id="td_0_0" class="readOnlyCell gContentSection">411978430-Intimate:Ruby:Small</td>

來源

2017-03-21 01:41:31

我可以使用表格，tr或td的最小高度嗎？

回答

相關問題