CSS3 – How to “restore” ::-webkit-scrollbar property to the default scroll bar

UPDATE 2022

I answered this almost 10 years ago and seems like after 2021 this solution stop working, read the solution from @Volomike, it might get you where you want to.


I just realized you can set all the properties in auto; and will do the trick. This is a self answer but I guess someday someone can have the same question.

/*Scroll bar nav*/
::-webkit-scrollbar {
    width: auto;
}

/* Track */
::-webkit-scrollbar-track {
    -webkit-box-shadow: auto; 
    -webkit-border-radius: auto;
    border-radius: auto;
    background:auto;    
}

/* Handle */
::-webkit-scrollbar-thumb {
    -webkit-border-radius:auto;
    border-radius:auto;
    background:auto; 
    -webkit-box-shadow:auto; 
}
::-webkit-scrollbar-thumb:window-inactive {
    background: auto; 
}

I don’t know if exist another method.

— UPDATE —
Look like you can also use the initial and unset value
//reverting all the values

::-webkit-scrollbar {
    all:unset;
}

or apply to an specific one {width : unset} || {width : initial}

NOTE: Using unset will not work on IE11

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)