Scrollbar isn't hidden on mobile

user_15983849 0
Viewed 56

I'm trying to hide the scrollbar from every element on my Vue + Vite app. I don't want to disable scroll, just hide it, so I'm using the following code.

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

It works fine and the scrollbar is hidden on desktop dimensions, but it doesn't disappear on mobile, even on Chrome devtools mobile. Here's my meta if that's of any help.

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

I'm using a default Vue Vite app, with some vertically overflowing content.

vue.js mobile scroll css html
1 Answers

you could try to make the scrollbar transparent:

::-webkit-scrollbar {
width: 0px;
background: transparent; 
}

You should place this code on a @media tag, so that it only affects mobile.

This solution was taken from this thread.

user_172892560
Related