Html Bootstrap 4嵌套响应表

我使用的是bootstrap4。我有一张桌子，里面有一张桌子，我希望能做出回应

实际上，所有这些都是一个表，但我只希望第二列和第二列可以滚动。我认为实现这一点的唯一方法是创建一个嵌套表，从第二列开始的所有内容都在它自己的

表响应
div中。但是，这不起作用，只有在生成整个表响应时才会发生响应

我会告诉你我有什么，也许我们可以找出如何使我的混乱响应，但如果有可能使一个表，其中只有第二列向前滚动的x轴，这将是可怕的。我真的被难住了。我希望id为
想要响应的表可以滚动，但是id为
没有响应的第一个表保持不变


.item{
最小高度：350px；
边框：1px实心#000；
边缘底部：20px；
背景：#f2f2
}

库存
时间表
土豆
苹果
玉米
生菜
1:20
1:52
2:30
3:17
3:35
4:22
4:45
5:15
6:15
6:30
7:25
7:37
7:50
8:02
8:15
8:27
8:40
8:52
1.
1.
1.
0
1.
0
1.
1.
0
1.
1.
1.
0
0
0
1.
0
1.
1.
1.
1.
0
1.
0
1.
1.
0
1.
1.
1.
0
0
0
1.
0
1.
1.
1.
1.
0
1.
0
1.
1.
0
1.
1.
1.
0
0
0
1.
0
1.
1.
1.
1.
0
1.
0
1.
1.
0
1.
1.
1.
0
0
0
1.
0
1.
我认为嵌套这么多表不是一个好主意，因为很难处理响应性设计。我将左表替换为
flex
，并移除了外部表。以下是修复方法：



.项目{
最小高度：350px；
边框：1px实心#000；
边缘底部：20px；
背景：#f2f2
}
.姓名{
填充：50px 0 34px；
}
.names>div{
边框：1px实心#dee2e6；
弹性：1；
显示器：flex；
对齐项目：居中；
证明内容：中心；
填充：10px；
高度：50px；
}
.表td{
高度：50px；
}
库存
时间表
土豆
苹果
玉米
生菜
1:20
1:52
2:30
3:17
3:35
4:22
4:45
5:15
6:15
6:30
7:25
7:37
7:50
8:02
8:15
8:27
8:40
8:52
1.
1.
1.
0
1.
0
1.
1.
0
1.
1.
1.
0
0
0
1.
0
1.
1.
1.
1.
0
1.
0
1.
1.
0
1.
1.
1.
0
0
0
1.
0
1.
1.
1.
1.
0
1.
0
1.
1.
0
1.
1.
1.
0
0
0
1.
0
1.
1.
1.
1.
0
1.
0
1.
1.
0
1.
1.
1.
0
0
0
1.
0
1.
我认为嵌套这么多表不是一个好主意，因为很难处理响应性设计。我将左表替换为
flex
，并移除了外部表。以下是修复方法：



.项目{
最小高度：350px；
边框：1px实心#000；
边缘底部：20px；
背景：#f2f2
}
.姓名{
填充：50px 0 34px；
}
.names>div{
边框：1px实心#dee2e6；
弹性：1；
显示器：flex；
对齐项目：居中；
朱