使滚动条在 iOS 15 上始终可见不起作用

Question

I'm trying to make the scrollbar of a div (not the entire body) always visible, it works everywhere except on Safari & Chrome on iOS. It looks like ::-webkit-scrollbar doesn't work on iOS.

The CSS that I've tried, that works everywhere but on iOS:

::-webkit-scrollbar {
   width: 20px;
   background: red;
}

Do you know any workaround to make it work? Do you know why iOS doesn't support that?

Thanks!

Answer 1

Try:

html,
html > * {
    -moz-overflow: -moz-scrollbars-vertical;
         overflow-y: scroll;
}
body::-webkit-scrollbar {
    width: 20px;
    background: red;
}

Hope this works.