1/* Hide scrollbar for Chrome, Safari and Opera */
2.scrollbar-hidden::-webkit-scrollbar {
3 display: none;
4}
5
6/* Hide scrollbar for IE, Edge add Firefox */
7.scrollbar-hidden {
8 -ms-overflow-style: none;
9 scrollbar-width: none; /* Firefox */
10}
1/* Hide scrollbar for Chrome, Safari and Opera */
2.example::-webkit-scrollbar {
3 display: none;
4}
5
6/* Hide scrollbar for IE and Edge */
7.example {
8 -ms-overflow-style: none;
9}
1::-webkit-scrollbar {
2 -webkit-appearance: none;
3 width: 7px;
4}
5::-webkit-scrollbar-thumb {
6 border-radius: 4px;
7 background-color: rgba(0, 0, 0, .5);
8 -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
9}
1/*Auto hide scrollbar for PC only*/
2@media (min-width:576px) {
3 /* Hide scrollbar for Chrome, Safari and Opera */
4 .hide-scrollbars::-webkit-scrollbar {
5 /*display: none; to completely hide the scrollbar*/
6 -webkit-appearance: none;
7 width: 4px; /*scrollbar width for vertical one*/
8 height: 4px; /*scrollbar width for horizontal one*/
9 }
10
11 .hide-scrollbars::-webkit-scrollbar-thumb {
12 visibility: hidden;
13 border-radius: 2px;
14 background-color: rgba(0, 0, 0, .1);
15 -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .1);
16 }
17
18 .hide-scrollbars::-webkit-scrollbar-thumb:hover {
19 visibility: visible;
20 }
21
22 /* Hide scrollbar for IE, Edge and Firefox */
23 .hide-scrollbars{
24 -ms-overflow-style: none; /* IE and Edge */
25 scrollbar-width: none; /* Firefox */
26 }
27}