[Ionic 5] Hide scrollbar on ion-content


I find it impossible to hide the webkit scrollbar on ion-content.
I’ve used pretty much every possible combination of

::-webkit-scrollbar {
        display: none !important;

ion-content::webkit-scrollbar {
 display:none !important;

*::-webkit-scrollbar {
        display: none !important;

And it still displays on every ion-content…
Actually sometimes it doesn’t display on the first ion-content, then on page change it starts displaying the scrollbar on every ion-content, even the first one!

I can’t understand why it’s so hard to disable a scrollbar? Does this problem come from the new web-components that have a shadow DOM so CSS rules don’t apply to them?
In this case, it would be wise to have a CSS variable to disable the scrollbar.

If anyone knows how to achieve this, please advice.

1 Like

I am having the same issue. Nothing is working. If anybody have an answer for this, please post it below.