How to prevent a webkit-scrollbar from pushing over the contents of a div?

Did you try putting overflow-y:overlay in the parent div? It works for me in chrome. This page says it works in safari, too.

This is how I made it work on Chrome, and not break Firefox:

overflow: scroll;
overflow-x: hidden;
overflow-y: overlay;

I mean, the scroll bar is still taking width space on Firefox, but at least it's still showing and working.

By just doing overflow-y: overlay;, I was fixing Chrome and breaking my Firefox scroll.