Javascript 如何将整个桌子放在一个框架中？

我已经做了一张桌子，可以分类，也可以出口。但是这里面有个问题，桌子的宽度不在桌子下面。如果我增加列数，那么div标记只保存导出和分页部分，表的其余列不在div标记下

我在此附上此问题的示例代码：

$（文档）.ready（函数（）{
$（'#示例'）。数据表（{
dom:'Bfrtip'，
按钮：[
“复制HTML5”，
“卓越HTML5”，
“csvHtml5”，
“pdfHtml5”
]
} );
} );

名称
位置
办公室
年龄
开始日期
薪水
名称
位置
办公室
年龄
开始日期
薪水
老虎尼克松
系统架构师
爱丁堡
61
2011/04/25
$320,800
老虎尼克松
系统架构师
爱丁堡
61
2011/04/25
$320,800
加勒特温特斯
会计
东京
63
2011/07/25
$170,750
老虎尼克松
系统架构师
爱丁堡
61
2011/04/25
$320,800
将整个表包装在一个
标记中，并将50%应用于div。
您的表大于div的大小。它没有响应，所以会溢出

您可以将
overflow-y:auto
设置为container div，它将隐藏表中溢出的部分，您可以滚动查看其余部分

第二个选择是重新设计您的表格，使其适合您的小div


$（文档）.ready（函数（）{
$（'#示例'）。数据表（{
dom:'Bfrtip'，
按钮：[
“复制HTML5”，
“卓越HTML5”，
“csvHtml5”，
“pdfHtml5”
]
} );
} );
.container{
宽度：70%；
溢出y：自动；
}

名称
位置
办公室
年龄
开始日期
薪水
名称
位置
办公室
年龄
开始日期
薪水
老虎尼克松
系统架构师
爱丁堡
61
2011/04/25
$320,800
老虎尼克松
系统架构师
爱丁堡
61
2011/04/25
$320,800
加勒特温特斯
会计
东京
63
2011/07/25
$170,750
老虎尼克松
系统架构师
爱丁堡
61
2011/04/25
$320,800
请阅读，与您的问题相关的代码直接属于您的问题，而不仅仅是发布在外部网站上。请进行相应的编辑。如果该列的值更大，则它将不起作用。我在示例代码中做了一些更改。请看一下，我添加了“overflow-y:auto”，但没有任何区别