Html CSS：当表格离开屏幕时获取水平滚动条

我有一个表，通常只有13列（一个空白列，然后是一年中12个月的列）。用户可以选择查看任何日历年或所有时间的数据。如果用户选择查看所有时间的数据，则该表将变得非常大，多年前每个月都有一列。当这种情况发生时，表格会离开屏幕，并且大部分数据都看不见。在本例中，我想应用

display:block；溢出：自动

为我提供了一个水平滚动条，而不是离开页面。但是，将此样式应用于表会使表在只有13行时占用的空间小于其父div的整个宽度。是否有方法实现

显示：块的行为；溢出：自动（提供滚动条而不是离开屏幕），但当表格较小时，是否也会占用全部空间

JSFiddle显示2个想要的案例和2个不想要的案例（在fiddle中标记为“GOOD”和“BAD”）


另外，我不确定这是否重要，但我们使用的是语义用户界面。我（大部分）镜像了实际应用程序中使用的类

提前谢谢你