iOS 14 and browser scroll bars (webkit)

Hello!

I have this scrollable container. It works fine across browsers and devices until it hits iOS14. Behaves just the way it should iOS 12 - (cant test iOS13 right now)

The goal is to always show the scrollbar. On iOS14 only the native scrollbar is shown when scrolling is happening.

Is there any way to fix this for iOS14 users?

thanks in advance!

Code Block
div {
max-height: 20rem;
overflow-x: hidden;
overflow-y: auto;
margin-right: 0.25rem;
::-webkit-scrollbar-track {
border-radius: 0.125rem;
background-color: lightgray;
}
::-webkit-scrollbar {
width: 0.25rem;
border-radius: 0.125rem;
}
::-webkit-scrollbar-thumb {
border-radius: 0.125rem;
background-color: gray;};
}
}


Post not yet marked as solved Up vote post of saschavino Down vote post of saschavino
15k views

Accepted Reply

Custom scrollbars are no longer supported in iOS 14.
  • 🤌 👁👄👁🤌 < BUT WHY ?

Add a Comment

Replies

Custom scrollbars are no longer supported in iOS 14.
  • 🤌 👁👄👁🤌 < BUT WHY ?

Add a Comment
Thanks!
Thank you for your answer Frameworks Engineer, because I have wasted a lot of time looking for the answer to this, with no hits from Apple docs/release notes.

Is there any place we can check so we aren't blindsided by such heavy handed, egregious regressions?

For now the mainstay has become, "use Chrome"

Sheeeesh! really!?!?!?!

it suck

Does anyone have a solution for this, then? How can we implement a non-custom scroll on iOS?

We would like to show the scrollbar all the time as we have a scrollable table and touch inputs tend to select cells/rows of that table rather than allowing for a scroll.