Skip to main content
Stack Overflow
  1. About
  2. For Teams

Return to Answer

Just making it a bit more clear that the top code block is SCSS and not CSS, as a few other seemed to get tripped up by that.
Source Link

This works for me cross-browser. However, this doesn't hide native scrollbars on mobile browsers.

.hide-native-scrollbar {
 scrollbar-width: none; /* Firefox 64 */
 -ms-overflow-style: none; /* Internet Explorer 11 */
 &::-webkit-scrollbar { /** WebKit */
 display: none;
 }
}

In SCSS

.hide-native-scrollbar {
 scrollbar-width: none; /* Firefox 64 */
 -ms-overflow-style: none; /* Internet Explorer 11 */
 &::-webkit-scrollbar { /** WebKit */
 display: none;
 }
}

In CSS

.hide-native-scrollbar {
 scrollbar-width: none; /* Firefox 64 */
 -ms-overflow-style: none; /* Internet Explorer 11 */
}
.hide-native-scrollbar::-webkit-scrollbar { /** WebKit */
 display: none;
}

This works for me cross-browser. However, this doesn't hide native scrollbars on mobile browsers.

.hide-native-scrollbar {
 scrollbar-width: none; /* Firefox 64 */
 -ms-overflow-style: none; /* Internet Explorer 11 */
 &::-webkit-scrollbar { /** WebKit */
 display: none;
 }
}

In CSS

.hide-native-scrollbar {
 scrollbar-width: none; /* Firefox 64 */
 -ms-overflow-style: none; /* Internet Explorer 11 */
}
.hide-native-scrollbar::-webkit-scrollbar { /** WebKit */
 display: none;
}

This works for me cross-browser. However, this doesn't hide native scrollbars on mobile browsers.

In SCSS

.hide-native-scrollbar {
 scrollbar-width: none; /* Firefox 64 */
 -ms-overflow-style: none; /* Internet Explorer 11 */
 &::-webkit-scrollbar { /** WebKit */
 display: none;
 }
}

In CSS

.hide-native-scrollbar {
 scrollbar-width: none; /* Firefox 64 */
 -ms-overflow-style: none; /* Internet Explorer 11 */
}
.hide-native-scrollbar::-webkit-scrollbar { /** WebKit */
 display: none;
}
added 236 characters in body
Source Link
Murhaf Sousli
  • 13.4k
  • 22
  • 126
  • 192

This works for me cross-browser. However, this doesn't hide native scrollbars on mobile browsers.

.hide-native-scrollbar {
 scrollbar-width: none; /* Firefox 64 */
 -ms-overflow-style: none; /* Internet Explorer 11 */
 &::-webkit-scrollbar { /** WebKit */
 display: none;
 }
}

In CSS

.hide-native-scrollbar {
 scrollbar-width: none; /* Firefox 64 */
 -ms-overflow-style: none; /* Internet Explorer 11 */
}
.hide-native-scrollbar::-webkit-scrollbar { /** WebKit */
 display: none;
}

This works for me cross-browser. However, this doesn't hide native scrollbars on mobile browsers.

.hide-native-scrollbar {
 scrollbar-width: none; /* Firefox 64 */
 -ms-overflow-style: none; /* Internet Explorer 11 */
 &::-webkit-scrollbar { /** WebKit */
 display: none;
 }
}

This works for me cross-browser. However, this doesn't hide native scrollbars on mobile browsers.

.hide-native-scrollbar {
 scrollbar-width: none; /* Firefox 64 */
 -ms-overflow-style: none; /* Internet Explorer 11 */
 &::-webkit-scrollbar { /** WebKit */
 display: none;
 }
}

In CSS

.hide-native-scrollbar {
 scrollbar-width: none; /* Firefox 64 */
 -ms-overflow-style: none; /* Internet Explorer 11 */
}
.hide-native-scrollbar::-webkit-scrollbar { /** WebKit */
 display: none;
}
Active reading [<http://en.wikipedia.org/wiki/WebKit>].
Source Link
Peter Mortensen
  • 31.3k
  • 22
  • 110
  • 134

This works for me cross-browser, however. However, this doesn't hide native scrollbars on mobile browsers.

.hide-native-scrollbar {
 scrollbar-width: none; /* Firefox 64 */
 -ms-overflow-style: none; /* IEInternet Explorer 11 */
 &::-webkit-scrollbar { /** WebkitWebKit */
 display: none;
 }
}

This works for me cross-browser, however, this doesn't hide native scrollbars on mobile browsers

.hide-native-scrollbar {
 scrollbar-width: none; /* Firefox 64 */
 -ms-overflow-style: none; /* IE 11 */
 &::-webkit-scrollbar { /** Webkit */
 display: none;
 }
}

This works for me cross-browser. However, this doesn't hide native scrollbars on mobile browsers.

.hide-native-scrollbar {
 scrollbar-width: none; /* Firefox 64 */
 -ms-overflow-style: none; /* Internet Explorer 11 */
 &::-webkit-scrollbar { /** WebKit */
 display: none;
 }
}
Source Link
Murhaf Sousli
  • 13.4k
  • 22
  • 126
  • 192
Loading
lang-html

AltStyle によって変換されたページ (->オリジナル) /