I want to hide a scroll bar in page but I can scroll like it has a scroll bar. so I cant use overflow:hidden because I want that I can scroll like normal but cannot see a scroll bar.
so I use this css code (class not-scroll-body is a class of body tag)
.not-scroll-body::-webkit-scrollbar {
display: none;
}
It works in Chrome , but when I use -moz-
instead of -webkit-
like this
.not-scroll-body::-moz-scrollbar {
display: none;
}
It doesn't work in Firefox.
What can I do to to make it work?
Thank you for every answer and sorry for my poor english language :)
In firefox 64, if you want to hide scroll when you have overflow:auto
you can now do scrollbar-width: none;
! Woop woop! Here are the relevant docs (browser support is show at bottom of page).
Below is a simple css only solution that will hide your vertical and horizontal scrollbar in firefox (tested in v64 & firefox dev edition v65.0b8). Hint: try vertical and horizontal scrolling on the blue div.
.not-scroll-body {
overflow: auto;
height: 200px;
width: 90%;
background: linear-gradient(to bottom, cyan, blue);
white-space: no-wrap;
/* the line that rules them all */
scrollbar-width: none;
/* */
}
span {
width: 200%;
height: 400%;
background: linear-gradient(to left, green, yellow);
display: inline-block;
margin: 5rem;
}
<div class="not-scroll-body"><span></span></div>