'Ionic 4 - Remove Scroll Bar
What is the best method to remove the scroll bar in Ionic 4 while still keeping the ability to scroll and using the shadow DOM?
::-webkit-scrollbar,
*::-webkit-scrollbar {
display: none;
}
This above has no effect.
Solution 1:[1]
Try this it will work fine for me in ionic 4
ion-content {
--offset-bottom: auto!important;
--overflow: hidden;
overflow: auto;
&::-webkit-scrollbar {
display: none;
}
}
Solution 2:[2]
The other solutions would disable my scrollbar. What fixed it for me was replacing my ion-contents with divs and adding this in app.scss
div {
-ms-overflow-style: none; /* Edge, Internet Explorer */
scrollbar-width: none; /* Firefox */
overflow-y: scroll;
}
// hides scrollbars while allowing to scroll
div::-webkit-scrollbar {
display: none; /* Chrome, Safari, Opera */
}
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|---|
Solution 1 | Rajasekhar |
Solution 2 | Eliran Assaraf |