Bear John
Bear John

Reputation: 3345

css hide scrollbar?

I am wanting to have a div area scrollable on my page and have set the overflow on my div CSS to scrollable but now I want to hide the scrollbar in all browsers, so the div can scroll without the scrollbar/panel displaying, including hiding that awful scroll panel in Firefox, I know how to hide the scrollbar in chrome but this doesn't work in firefox, can anyone suggest anything thanks?

here's what i'm using to hide the scrollbar in chrome and other webkit browsers:

#element::-webkit-scrollbar { 
    display: none; 
}

Upvotes: 5

Views: 16971

Answers (3)

nelson eldoro
nelson eldoro

Reputation: 2090

This has worked for me

::-webkit-scrollbar {
      width: 0 !important;
   }
-ms-overflow-style: none;

Upvotes: 1

chendind
chendind

Reputation: 109

i found someone gives that answer:

.noscrollbar{
  -ms-overflow-style:none;
  overflow:-moz-scrollbars-none;// but it seems to not work...
}
.noscrollbar::-webkit-scrollbar{width:0px}

Upvotes: 1

cockypup
cockypup

Reputation: 1043

Not pure CSS (since you have to add an extra element) but how about making your div a bit wider and then wrapping it in another div with overflow:hidden?

The inner div would still scroll but the scroll bar would be outside the margins of the outer div, so they would not be visible.

Upvotes: 1

Related Questions