"overflow: hidden" on "body" produces glitchy scrollbar with USB mouse
If you are on a mac, chances are your OS is adding the scroll bar when you plug in the mouse, a scroll bar that will override most CSS selectors.
There is not a way to override this with CSS that I am aware of. If you change your system preferences you will find your website behaving the way you intended.
System Preferences -> General -> Show Scroll Bars -> Change from [ALWAYS] to [WHEN SCROLLING]
.MY_CSS_CLASS::-webkit-scrollbar { width: 0px; height: 0px; background: transparent;}This fixed my issue with ugly scrollbar being displayed when mouse is connected.
Specifying width to the body element will keep content width constant.
Here is the working example: https://jsfiddle.net/fuhacLtn/2/