Hidden scrollbars in Firefox (allows you to scroll, but without a scrollbar)

Question

I would like to create a div that can scroll, but does not display scrollbars. I found a solution for Webkit (below), but how can this be done in other browsers?

I would prefer not to use the javascript plugin. Hope to find a CSS or vendor specific solution.

---

Webkit Solution

#photoreel::-webkit-scrollbar { height: 0; width: 0; } #photoreel { overflow-x: scroll; overflow-y: hidden; } 

Answer 1

You must wrap your scrollable div in another div with overflow:hidden , which hides the scroll bar.

See http://jsfiddle.net/qqPcb/ for an example.

BTW: the same technique uses a nice jQuery plugin called jScrollPane

Answer 2

If you mean the scoll panel that Firefox creates (for example, the one to the right of this page), I don't think you can. See Link for a better explanation.

Answer 3

2019 decision

Starting with Firefox 64 there is a completely simple solution for this (it only works in Firefox and Firefox for mobile devices)

 scrollbar-width: none; 

Check documents

. For visitors from a post marked as duplicate , there is also an MS Edge solution:

 -ms-overflow-style: -ms-autohiding-scrollbar; 

Answer 4

Well, there is a much easier way! just put

  ::-webkit-scrollbar { width: 0px; height: 10px; } 

in your css style and you're done with!