Search code examples
htmlcsswebkit

Webkit Scroll Bar applied to certain element

I am currently trying to apply the Scroll Bar webkit styling to a certain element however, with no luck. I have looked everywhere; There are 2 threads on Stack Overflow I have seen however, do not work.

Most of the threads say to use:

.class-name::-webkit-scrollbar { }

However I have had not luck with this

This is a full example of what people are reccomending (it doesnt work): http://codepen.io/wrdle/pen/BQYBjN

If you help it is much appreciated! :) Thanks

Solution

  • Your CSS works just fine - the problem in your CodePen is that the document is scrolling, not the #container element, so you don't see its scrollbar.

    Add this CSS as an example to see the correct scrollbar:

    #container {
  height: 500px;
  overflow: auto;
}

    Updated CodePen: http://codepen.io/capitalq/pen/MbQgJv