Adding css support for multiple browsers removes the style for all the browsers

problem

I have a glowing scrollbar added for chrome, when I try to add it in other browsers the scrollbar styling gets removed in chrome and all the other browsers

code

 ::-webkit-scrollbar,
 ::-moz-scrollbar,
 ::-o-scrollbar,
 ::-ms-scrollbar{
    width: 15px;
}

 ::-webkit-scrollbar-thumb,
 ::-moz-scrollbar-thumb,
 ::-o-scrollbar-thumb,
 ::-ms-scrollbar-thumb{
    box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #0004ff, 0 0 30px #0004ff, 0 0 40px #0004ff, 0 0 55px #0004ff, 0 0 75px #0004ff;
    background-color: rgb(255, 255, 255);
    border-radius: 10px;
}

 ::-webkit-scrollbar-track,
 ::-moz-scrollbar-track,
    ::-o-scrollbar-track,
    ::-ms-scrollbar-track{
    background: rgb(0, 0, 0);
}

fiddle

https://jsfiddle.net/cr4Lwzyb/1/

You have the separate each selector, since browsers will ignore the entire ruleset if the selector is unknown.

 ::-webkit-scrollbar { width: 15px; }
 ::-moz-scrollbar { width: 15px; }
 ::-o-scrollbar { width: 15px; }
 ::-ms-scrollbar { width: 15px; }

 ::-webkit-scrollbar-thumb {
    box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #0004ff, 0 0 30px #0004ff, 0 0 40px #0004ff, 0 0 55px #0004ff, 0 0 75px #0004ff;
    background-color: rgb(255, 255, 255);
    border-radius: 10px;
 }
 ::-moz-scrollbar-thumb {
    box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #0004ff, 0 0 30px #0004ff, 0 0 40px #0004ff, 0 0 55px #0004ff, 0 0 75px #0004ff;
    background-color: rgb(255, 255, 255);
    border-radius: 10px;
 }
 ::-o-scrollbar-thumb {
    box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #0004ff, 0 0 30px #0004ff, 0 0 40px #0004ff, 0 0 55px #0004ff, 0 0 75px #0004ff;
    background-color: rgb(255, 255, 255);
    border-radius: 10px;
 }
 ::-ms-scrollbar-thumb {
    box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 20px #0004ff, 0 0 30px #0004ff, 0 0 40px #0004ff, 0 0 55px #0004ff, 0 0 75px #0004ff;
    background-color: rgb(255, 255, 255);
    border-radius: 10px;
 }

 ::-webkit-scrollbar-track { background: rgb(0, 0, 0); }
 ::-moz-scrollbar-track { background: rgb(0, 0, 0); }
 ::-o-scrollbar-track { background: rgb(0, 0, 0); }
 ::-ms-scrollbar-track { background: rgb(0, 0, 0); }

Also please note that all browsers don't support these styles, regardless of selector prefixes. Read more about the current state of scrollbar styling.