Html 小车滚动条行为

我试图实现一个可滚动的内容布局，我成功地做到了，但是滚动条显示出奇怪的行为——有时无法点击，有时箭头无法移动，有时只有一个箭头可以移动，即使在任何方向都有空间滚动，等等

.content包装器{
显示器：flex；
证明内容：中心；
溢出y：滚动；
柔性生长：1；
/*对于Firefox*/
最小高度：0；
}
.tsp含量{
显示器：flex；
弯曲方向：立柱；
}

Lorem-Ipsum（0328）

洛雷米普苏姆


Lorem-Ipsum（0328）

洛雷米普苏姆


Lorem-Ipsum（0328）

洛雷米普苏姆


Lorem-Ipsum（0328）

洛雷米普苏姆


Lorem-Ipsum（0328）

洛雷米普苏姆


Lorem-Ipsum（0328）

洛雷米普苏姆


Lorem-Ipsum（0328）

洛雷米普苏姆


Lorem-Ipsum（0328）

洛雷米普苏姆


Lorem-Ipsum（0328）

洛雷米普苏姆


Lorem-Ipsum（0328）

洛雷米普苏姆

您的问题是

位于可滚动内容的顶部，因此它不会滚动

我添加了

z-index:0

到

.path

和

z-index:1到
.content wrapper
，它就工作了

你可以在这里查一下

我强烈建议在CSS中添加任何类型的背景形状作为背景。
这就解决了它，谢谢！你知道为什么z指数会导致这个问题吗？我的理解是，滚动条属于contentwrapper div，它是一个单独的元素。。为什么它会以这种方式与img交互？
z-index
没有引起问题。滚动的工作原理是，web浏览器将尝试滚动鼠标光标当前所在的内容。大多数时候，你的光标在图像上方，试着把鼠标放在屏幕的左侧，滚动就会起作用，因为你现在在可滚动的内容上方。我的解决办法是解决一个不必要的问题。正如我告诉过你的，尝试使用CSS作为图像背景，比如