0

I have a custom scroll bar accomplished by the code as shown here:

::selection {
    background: #333;
    color: #FFF;
}
::-webkit-scrollbar {
    width: 9px;
}
::-webkit-scrollbar-track {
    background:#eee;
    border: thin solid lightgray;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.1) inset;
}
::-webkit-scrollbar-thumb {
    background:#999;
    border: thin solid gray;
}

It works fine on Chrome, Firefox... but Internet Explorer it does not work What should I add?

edgarmtze
  • 24,683
  • 80
  • 235
  • 386
  • possible duplicate of [CSS customized scroll bar in div](http://stackoverflow.com/questions/9251354/css-customized-scroll-bar-in-div) – kapa Apr 21 '15 at 06:16

1 Answers1

4

The CSS specified will only apply a custom scrollbar on a webkit browser such as Chrome and Safari. Internet Explorer only supports a limited amount of scrollbar customisation. See the MSDN reference and this IE scrollbar CSS generator.

Also, Firefox doesn't support custom scrollbars (bug report), so I'm not sure how your CSS is working in Firefox - it isn't for me.

If you want, you can use JavaScript-based jScrollPane to implement custom scrollbars in all browsers, but be warned, many people hate the user experience on JavaScript scrollbars, myself included.

Cameron
  • 1,017
  • 2
  • 10
  • 18