Bootstrap 4 将水平滚动条固定在一个框中

我在盒子里做了一个水平滚动条。它在大屏幕上工作良好。但对于移动屏幕，滚动条不在所需位置

从笔记本电脑的角度来看，它工作正常

滚动条的位置不在所需位置

这是我的代码：

。滚动条{
左边距：0px；
浮动：左；
高度：145px；
宽度：96%；
//背景：#fff；
//溢出y：隐藏；
溢出-x：滚动；
}
.scrollbar动画：：-webkit scrollbar{
宽度：12px；
背景色：#f5；}
.scrollbar动画：：-webkit scrollbar thumb{
边界半径：10px；
-webkit盒阴影：插入0 0 6px rgba（0,0,0,0.1）；
背景色：橙色；}
.信息框图标
{
宽度：130px；
高度：150像素；
填充顶部：18px；
}
.信息框内容
{
宽度：93%；
高度：150像素；
}

积木
测试测试

---

默认情况下，div没有高度或宽度。因此，首先添加一些高度和宽度。然后，您需要添加一些内容（文本/其他元素等）以检查功能。这更像是如果你没有提到围栏区域，那么当有人越过（溢出）围栏/边界时，他怎么知道

兄弟，但滚动条在顶部。我需要底部的滚动条。请先设置div的高度和宽度，然后添加一些内容，如文本，然后进行检查。此代码可能会回答问题，提供有关此代码为什么和/或如何回答问题的附加上下文，以提高其长期价值。@rollstuhlfahrer。。。现在我面临另一个问题与滚动条。请再复习一下我的问题。需要帮助正确使用引导网格您似乎正在使用自定义CSS来维护

信息框内容

和

信息框图标

，但并非针对所有屏幕大小正确编写。我建议你使用引导网格，这样你会更安全

.info-box-content{
   width: 30%; //use proper width if using bootstrap then use according grid layout
  height: auto; //leave it or can put some value
   overflow-x: scroll;
 }