Table fixed header and scrollable body

Question

I am trying to make a table with fixed header and a scrollable content using the bootstrap 3 table. Unfortunately the solutions I have found does not work with bootstrap or

Answer 1

Here is the working solution:

table {
    width: 100%;
}

thead, tbody, tr, td, th { display: block; }

tr:after {
    content: ' ';
    display: block;
    visibility: hidden;
    clear: both;
}

thead th {
    height: 30px;

    /*text-align: left;*/
}

tbody {
    height: 120px;
    overflow-y: auto;
}

thead {
    /* fallback */
}


tbody td, thead th {
    width: 19.2%;
    float: left;
}

    

        

            
Make
            
Model
            
Color
            
Year
        
    
    

        

            
Ford
            
Escort
            
Blue
            
2000
        
        

            
Ford
            
Escort
            
Blue
            
2000
        
        

            
Ford
            
Escort
            
Blue
            
2000
        
        

            
Ford
            
Escort
            
Blue
            
2000
        
    

Link to jsfiddle