列寬可調整大小的粘性標題

Question

我有一個普通表。我的標題不粘。我嘗試了多種方式，但沒有奏效。我的列表非常大，所以我打算只有行而不是標題的滾動條。我的列可以調整大小。

thead { 
    display: table-header-group; 
    vertical-align: middle; 
    border-color: inherit; 
} 


tbody { 
    display: table-row-group; 
    vertical-align: middle; 
    border-color: inherit; 
} 

Answer 1

粘性可以是一個有點棘手（抱歉的雙關語）

這裏的事情可能是，無論是粘對象和父母必須是一個塊。但是，這並不能與您希望可調整大小的列一起使用。

我用一個小的jQuery最好兩者結合起來：

$('table, td, th, thead').width(function() {  
    return $(this).width(); 
}); 

$('td, th').height(function() { 
    return $(this).height(); 
}); 

$('table, thead').css('display','block') 

這wayyour THEAD將堅持（你把正確的CSS後）

position: -webkit-sticky; 
position: -moz-sticky; 
position: -ms-sticky; 
position: -o-sticky; 
position: sticky; 
top: 0px; 

（不要忘了頂部：0像素！）