表具有固定的高度和報頭和式柱寬度與自舉3

Question

我想有具有以下特徵的表：

• 固定報頭，
• 固定高度（用可見光滾動條）
• 3固定寬度的柱子（一個大柱子和兩個窄柱子）。

我開始使用：

tbody { display:block; overflow:auto; height:100px; } 

至少拿到固定的高度，但這個規則擠壓左邊的表（如果必要的話，我會提供一個屏幕截圖）。

該表包含在Bootstrap 3列中。

下面是一個例子http://jsfiddle.net/PGEdK/

任何想法？提前致謝。

Answer 1

這裏是它的工作就像你預料的JS FIDDLE DEMO。實際上，你的tbody風格沒有問題。您只需要爲您的第和td添加更多款式。所以，你的最終代碼會是這樣的：

tr {display: block; } 
th, td { width: 300px; } 
tbody { display: block; height: 100px; overflow: auto;} 

如果你看一下小提琴，你會發現，我已經包裹日與TR，這樣我可以給適當的寬度使後TH顯示：塊樣式爲tr。所以，如果你想瞄準只包裹th的tr，你也可以做到這一點。

爲了演示的目的，我用.tablecontainer類包裝了表格，以便我們有一定的寬度來處理。

Answer 2

嘗試最大高度和最大寬度。它設置最大高度和寬度