表不以CSS屬性

我創建了一個HTML表格迴應，我想設置一個max-height和height性能，它
但該表不接受他們
我使用此代碼
HTML表不以CSS屬性

<table class="table table-striped table-hover" id="Table"> 
    <thead> 
     <tr> 
      <th>Column 1</th> 
      <th>Column 2</th> 
      <th>Column 3</th> 
      <th>Column 4</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td>Row 0 0</td> 
      <td>Row 0 1</td> 
      <td>Row 0 2</td> 
      <td><a id="table-buttons" class="btn btn-primary">Row 0 3</a></td> 
     </tr> 
     <tr> 
      <td>Row 1 0</td> 
      <td>Row 1 1</td> 
      <td>Row 1 2</td> 
      <td><a id="table-buttons" class="btn btn-primary">Row 1 3</a></td> 
     </tr> 
     <tr> 
      <td>Row 2 0</td> 
      <td>Row 2 1</td> 
      <td>Row 2 2</td> 
      <td><a id="table-buttons" class="btn btn-primary">Row 2 3</a></td> 
     </tr> 
    </tbody> 
</table>

CSS

#Table { 
    width: 600px; 
    max-width: 600px; 
    height: 210px; 
    max-height: 210px; 
    overflow-y: auto; 
} 

td { 
    width: 150px; 
    max-width: 150px; 
}

表：

指定height和max-height
一定不能讓表進行比這三行越來越頭
但是當我添加其他行的表完全無視height和max-height
和擴展以適應四行

我想表顯示滾動條爲overflow-y: auto財產
的結果，但並沒有發生

我使用這Bootstrap風格

請幫助

來源

2017-09-13 O. Shehab

你是如何，包括你的CSS？ – jmargolisvt

是的，我包括它 –

設置表格高度被表格內容取代。看到這個答案：display table height not always respected

你可以繞過它周圍（並設置div的高度和溢出）解決它。

來源

2017-09-13 14:51:46

感謝您的https： //stackoverflow.com/a/36987513/8058050回答爲我工作 –

@ O.Shehab您可以對該答案進行投票，因爲您發現它很有用。 – Jonathan

-3

您應該針對類，而不是ID。

像這樣：

.table { 
    width: 600px; 
    max-width: 600px; 
    height: 210px; 
    max-height: 210px; 
    overflow-y: auto; 
}

來源

2017-09-13 14:48:18

爲什麼會這樣？ – jmargolisvt

那不是真的 –

嗯，它適合我嗎？當我改變了它從ID名和類名 –

把表中一個div，並設置高度和寬度爲DIV：

<div id="Table"> 
    <table class="table table-striped table-hover"> 
    <!-- Table rows and data --> 
    </table> 
</div>

注：從上表標籤刪除ID。

來源

2017-09-13 14:51:30 Laiman

只是包裝一個div的table左右，結賬這個Codepen用於演示

來源

2017-09-13 14:55:01

表不以CSS屬性

回答

相關問題