# How can I hide the scrollbar on AnkiDroid? **URL:** \ **Category:** Card Design\ **Created:** [May 10, 2025, 1:29am UTC](https://forums.ankiweb.net/t/how-can-i-hide-the-scrollbar-on-ankidroid/60648 "2025-05-10T01:29:26Z")\ **Posts on this page:** 14\ **Page:** 1
**Author:** ![Anon\_0000](https://avatars.discourse-cdn.com/v4/letter/a/c67d28/32.png) [@Anon\_0000](https://forums.ankiweb.net/u/Anon_0000)\ **Post date:** [May 10, 2025, 1:29am UTC](https://forums.ankiweb.net/t/how-can-i-hide-the-scrollbar-on-ankidroid/60648/1 "2025-05-10T01:29:26Z")
I wish to hide the scrollbar while still allowing scrolling if necessary. On Anki, I can hide the scrollbar with the following code: ```auto body::-webkit-scrollbar { display: none; } ``` However, this doesn’t work on AnkiDroid. I also tried ```auto body::-webkit-scrollbar { display: none; width: 0; height: 0; } ``` The scrollbar is still visible, though, and happily doing it’s thing when I’m scrolling. I read that the scrollbar might be outside of CSS’s control – maybe someone here knows more whether it’s possible or not (and how to do it in case it is possible)? Thanks! ---
**Author:** ![Eltaurus](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/eltaurus/32/10287_2.png) [@Eltaurus](https://forums.ankiweb.net/u/Eltaurus)\ **Post date:** [May 11, 2025, 9:54am UTC](https://forums.ankiweb.net/t/how-can-i-hide-the-scrollbar-on-ankidroid/60648/2 "2025-05-11T09:54:25Z")
The fact that the scrollbar is not showing when a card is inspected with dev tools probably indicates that it indeed is not a part of the webview and is not accessible from CSS directly. Although, using something like ```auto :root { overflow: hidden; } body { border-bottom: 1px transparent solid; height: 100vh; } ``` seems to prevent the bar from appearing ---
**Author:** ![Anon\_0000](https://avatars.discourse-cdn.com/v4/letter/a/c67d28/32.png) [@Anon\_0000](https://forums.ankiweb.net/u/Anon_0000)\ **Post date:** [May 11, 2025, 9:59am UTC](https://forums.ankiweb.net/t/how-can-i-hide-the-scrollbar-on-ankidroid/60648/3 "2025-05-11T09:59:43Z")
> [@Eltaurus](#): > > `overflow: hidden;` I cannot use this though as this disables scrolling as well. Especially on AnkiDroid, I have cards that need to be scrollable in order to view all info on them (because of lists, pictures, additional info, ect.). > [@Eltaurus](#): > > probably indicates that it indeed is not a part of the webview and is not accessible from CSS directly. That’s unfortunate. Thanks for the clarification though. ---
**Author:** ![Eltaurus](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/eltaurus/32/10287_2.png) [@Eltaurus](https://forums.ankiweb.net/u/Eltaurus)\ **Post date:** [May 11, 2025, 10:11am UTC](https://forums.ankiweb.net/t/how-can-i-hide-the-scrollbar-on-ankidroid/60648/4 "2025-05-11T10:11:18Z")
> [@Anon\_0000](#): > > I cannot use this though as this disables scrolling as well. It should not. At least, in my tests cards remain scrollable. The idea was to make the body of a card act as a scrollable container for the rest of the elements, instead of scrolling the card as an entire document in the AnkiDroid window to avoid exterior scrollers. ---
**Author:** ![Anon\_0000](https://avatars.discourse-cdn.com/v4/letter/a/c67d28/32.png) [@Anon\_0000](https://forums.ankiweb.net/u/Anon_0000)\ **Post date:** [May 11, 2025, 11:05am UTC](https://forums.ankiweb.net/t/how-can-i-hide-the-scrollbar-on-ankidroid/60648/5 "2025-05-11T11:05:26Z")
Odd. My cards stopped scrolling as soon as I entered the code you provided. I don’t think I’ve got anything that interferes with scrolling on my cards, but I’ll have to check with a default basic card. ---
**Author:** ![Eltaurus](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/eltaurus/32/10287_2.png) [@Eltaurus](https://forums.ankiweb.net/u/Eltaurus)\ **Post date:** [May 11, 2025, 11:15am UTC](https://forums.ankiweb.net/t/how-can-i-hide-the-scrollbar-on-ankidroid/60648/6 "2025-05-11T11:15:51Z")
I guess that depends on how the sizes of other elements on the cards are calculated. Some adjustments might be in order. But the `overflow: hidden` on the root element should not prevent scrolling by itself, because the body – its direct child – is set up to fit the size of the screen, so there should be no overflow happening at this level. Maybe explicitly setting ```auto body { overflow-y: auto; } ``` can help ---
**Author:** ![Anon\_0000](https://avatars.discourse-cdn.com/v4/letter/a/c67d28/32.png) [@Anon\_0000](https://forums.ankiweb.net/u/Anon_0000)\ **Post date:** [May 11, 2025, 12:59pm UTC](https://forums.ankiweb.net/t/how-can-i-hide-the-scrollbar-on-ankidroid/60648/7 "2025-05-11T12:59:16Z")
> [@Eltaurus](#): > > But the `overflow: hidden` on the root element should not prevent scrolling by itself, because the body – its direct child – is set up to fit the size of the screen, so there should be no overflow happening at this level. Maybe steps to reproduce can help: # Steps to reproduce 1. Create a new default _Basic_ type. 2. Add the following css: ```auto .card { font-family: arial; font-size: 20px; text-align: center; color: black; background-color: white; } :root { overflow: hidden; } body { border-bottom: 1px transparent solid; height: 100vh; overflow-y: auto; } ``` 1. Enter a random string into _Front_, like `This is a question.`. 2. Enter something unreasonably long into _Back_, to emphesize the issue. E.g. ```auto
  1. This is a very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very long answer.
  2. This is a very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very long answer.
  3. This is a very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very long answer.
  4. This is a very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very long answer.
  5. This is a very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very long answer.
  6. This is a very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very long answer.
  7. This is a very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very long answer.
  8. This is a very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very long answer.
  9. This is a very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very long answer.
  10. This is a very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very long answer.
  11. This is a very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very long answer.
``` 1. View the card. # Result 1. Anki auto scrolls to the `hr` element. I cannot scroll anymore to view the question with the css above. 2. If I make the window smaller, a scrollbar appears and I can indeed scroll vertically. But issue #1 is still there. 3. Without `overflow-y: auto;` there is no scrollbar like in #2 and scrolling doesn’t work either. ---
**Author:** ![Eltaurus](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/eltaurus/32/10287_2.png) [@Eltaurus](https://forums.ankiweb.net/u/Eltaurus)\ **Post date:** [May 11, 2025, 10:08pm UTC](https://forums.ankiweb.net/t/how-can-i-hide-the-scrollbar-on-ankidroid/60648/8 "2025-05-11T22:08:54Z")
> [@Anon\_0000](#): > > Anki auto scrolls to the `hr` element. I cannot scroll anymore to view the question with the css above. That’s weird. When I reproduced the test card, the scrolling worked just fine (AnkiDroid 2.20.1). On the other hand, `border-bottom` turned out to only work when set with dev tools and not when placed on the card itself, but using full `border` property instead still did the trick: ---
**Author:** ![Anon\_0000](https://avatars.discourse-cdn.com/v4/letter/a/c67d28/32.png) [@Anon\_0000](https://forums.ankiweb.net/u/Anon_0000)\ **Post date:** [May 11, 2025, 10:29pm UTC](https://forums.ankiweb.net/t/how-can-i-hide-the-scrollbar-on-ankidroid/60648/9 "2025-05-11T22:29:50Z")
Sorry, I didn’t test it on AnkiDroid yet. The issues I was talking about happend on Anki (24.11, 87ccd24e). As I need to be able to scroll there as well, I tested it on Anki first (e.g. images are displayed much larger than on AnkiDroid and thus need more space). And since it didn’t work there I didn’t try it on AnkiDroid. I can test it tomorrow. If it works on AnkiDroid for me too, the issue on Anki would need to be resolved though. ---
**Author:** ![Eltaurus](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/eltaurus/32/10287_2.png) [@Eltaurus](https://forums.ankiweb.net/u/Eltaurus)\ **Post date:** [May 11, 2025, 11:25pm UTC](https://forums.ankiweb.net/t/how-can-i-hide-the-scrollbar-on-ankidroid/60648/10 "2025-05-11T23:25:54Z")
> [@Anon\_0000](#): > > the issue on Anki would need to be resolved though Any CSS can be easily made specific to a certain platform by using respective root classes (`.android` for AnkiDroid), which is why I would focus on making it work on the target platform first, and do all the other accosiated adjustements later. However, I don’t experience any problems with scrolling on the desktop app either (25.02.4, a5c33ad0) for some reason. Maybe it’s an OS thing? ---
**Author:** ![Anon\_0000](https://avatars.discourse-cdn.com/v4/letter/a/c67d28/32.png) [@Anon\_0000](https://forums.ankiweb.net/u/Anon_0000)\ **Post date:** [May 12, 2025, 9:09pm UTC](https://forums.ankiweb.net/t/how-can-i-hide-the-scrollbar-on-ankidroid/60648/11 "2025-05-12T21:09:41Z")
> [@Eltaurus](#): > > However, I don’t experience any problems with scrolling on the desktop app either (25.02.4, a5c33ad0) for some reason. Maybe it’s an OS thing? I just tested it with Anki `25.05 (8fc822a6) (src) (ao)` and it does work here without issues. The build runs in a vm with debian unstable (basically the latest version meant for testing). So it might either be the newer anki version or the newer OS version. * * * I tested the code ```auto :root { overflow: hidden; } body { border-bottom: 1px transparent solid; height: 100vh; overflow-y: auto; } ``` on AnkiDroid just now. It blocks the scrolling there as well (just like on my debian stable with Anki 24.11) and the scrollbars are still visible. I cannot upgrade my webview though, as my Android device is EOL and over 6 years old (My Android System Webview is on version 103.0.5060.71). ---
**Author:** ![Eltaurus](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/eltaurus/32/10287_2.png) [@Eltaurus](https://forums.ankiweb.net/u/Eltaurus)\ **Post date:** [May 12, 2025, 10:55pm UTC](https://forums.ankiweb.net/t/how-can-i-hide-the-scrollbar-on-ankidroid/60648/12 "2025-05-12T22:55:56Z")
> [@Anon\_0000](#): > > (My Android System Webview is on version 103.0.5060.71). I suppose it is the issue. Not that my device is much newer, but it runs v135, atm. The original idea of making a scrollable container out of a certain card element instead of scrolling the card as a whole might still work. Although considering how fiddly all of this is, it will probably require quite a lot of trial-and-error to find the right combination of CSS rules that will amount to the right effect on a particular system. I am still puzzled by the scrolling getting disabled, though, because it should not happen in theory with the given css, and I also can’t reproduce it anywhere (just tried in 24.11 (87ccd24e) on win11, and it still worked as expected)⁩. All the properties involved are very old and well-established as well, it’s unusual to see them acting differently depending on a system. A careful inspection of how the sizes of each element are determined, and what their resulting scrolling properties are, might reveal something, but it won’t be easy either. ---
**Author:** ![Anon\_0000](https://avatars.discourse-cdn.com/v4/letter/a/c67d28/32.png) [@Anon\_0000](https://forums.ankiweb.net/u/Anon_0000)\ **Post date:** [May 12, 2025, 11:08pm UTC](https://forums.ankiweb.net/t/how-can-i-hide-the-scrollbar-on-ankidroid/60648/13 "2025-05-12T23:08:19Z")
I think I’ll just ignore the scrollbars on AnkiDroid, then. Thank you for your thorough help Eltaurus! ---
**Author:** ![system](https://us1.discourse-cdn.com/flex002/uploads/anki2/original/1X/8f1279ababc5879d54e4838989f606cfe55af8c7.jpeg) [@system](https://forums.ankiweb.net/u/system)\ **Post date:** [June 11, 2025, 11:09pm UTC](https://forums.ankiweb.net/t/how-can-i-hide-the-scrollbar-on-ankidroid/60648/14 "2025-06-11T23:09:00Z")
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.