How To Make Scrollbar Invisible - Transparent

Hey is it possible to make scrollbar 'hidden' i dont wanna use overflow-y: hidden just something like background: transparent or something like that

Solution 1:

Here you will find a description how to hide the scrollbar just with CSS. And here in the second example you will find a solution how to hide the scrollbar within a div for example. The trick in the second example is to define a wider div container that the surrounding one.

.hidden-scrollbar.inner {
   height:200px;
   overflow:auto;
   margin:15px -300px15px15px;
   padding-right:300px;
}

Just play arround with the values of margin and padding.

Solution 2:

There is a CSS rule that can hide scrollbars in Webkit-based browsers (Chrome and Safari). That rule is:

.element::-webkit-scrollbar { width: 0!important }

u can change width / background-color and other properties .

::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 006pxrgba(0,0,0,0); 
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 006pxrgba(0,0,0,0); 
}

this css code might work

Solution 3:

In Webkit browsers:

::-webkit-scrollbar { 
    display: none; 
}