Different looks on scrollbars when using USB mouse vs wireless/trackpad in OS X

Question

I just realized that Mac OS X shows different scrollbars in the browsers when a USB mouse is connected or not. I tried the code below and it looks ok, but now when I disconnect the mouse it applies to the wireless settings as well, which I was happy with already (scrollbars only showing when scrolling or hovering it).

::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 15px;
    background-clip: padding-box;
    border: 4px solid rgba(0, 0, 0, 0);
    -webkit-border-radius: 7px;
    background-color: rgba(0, 0, 0, 0.15);
    -webkit-box-shadow: inset -1px -1px 0px rgba(0, 0, 0, 0.05), inset 1px 1px 0px rgba(0, 0, 0, 0.05);
}
::-webkit-scrollbar-thumb {
    border: 4px solid rgba(0, 0, 0, 0);
    background-clip: padding-box;
    -webkit-border-radius: 7px;
    background-color: rgba(255, 255, 255, 0.8);
    -webkit-box-shadow: inset -1px -1px 0px rgba(0, 0, 0, 0.05), inset 1px 1px 0px rgba(0, 0, 0, 0.05);
}

Can I: 1. Write CSS for the USB mouse only? 2. Do something that makes the USB mouse look/act like the wireless mouse.

Thank you!

Answer 1

Here is what I found: OSX: Remove scrollbars that appear when using a mouse

Fortunately the solution lay in the General preferences pane. All that's needed is to change "Show scroll bars" to "When scrolling" instead of "Automatically based on mouse or trackpad.

Conclusion: I think the solution is beyond our/developers' control. Just leave it to the user.