带滚动的固定表头没有响应设计

Question

我希望在滚动工作的表格上有一个固定的标题，并且重新调整响应设计会创建一个水平滚动

1. 尽管出现溢出，水平滚动仍无法正常工作：自动

2. 似乎我唯一可以保持列标题和行列保持相同宽度的方法是删除

   display: block;
   

删除“display：block的问题;即使我似乎在页面上获得了宽度较小的响应式设计，我也不再有用于滚动行的固定标题。

    table tbody, table thead
    {
        display: block; 
    }

https://jsfiddle.net/bthorn/j9ndqetc/