Overflow: auto causes flickering vertical scroll bar
Hi everyone,
I'm currently working on a React component that has a maximum height limit. Once it reaches this height, overflow: auto is applied to allow scrolling. The component's children are collapsible accordions, which are initially collapsed. When all accordions are expanded, the content exceeds the max height and the scrollbar appears as expected.
The issue comes up when collapsing the accordions. As the content height decreases, the scrollbar briefly flickers before disappearing. I’ve already tried setting scrollbar-gutter: stable, but the scrollbar thumb still flickers before it goes away.
I’ve spent quite a bit of time debugging this and would really appreciate any suggestions or ideas on how to fix the flickering behaviour.
Thanks in advance!
I'm currently working on a React component that has a maximum height limit. Once it reaches this height, overflow: auto is applied to allow scrolling. The component's children are collapsible accordions, which are initially collapsed. When all accordions are expanded, the content exceeds the max height and the scrollbar appears as expected.
The issue comes up when collapsing the accordions. As the content height decreases, the scrollbar briefly flickers before disappearing. I’ve already tried setting scrollbar-gutter: stable, but the scrollbar thumb still flickers before it goes away.
I’ve spent quite a bit of time debugging this and would really appreciate any suggestions or ideas on how to fix the flickering behaviour.
Thanks in advance!
