Stop scrollbar from pushing content left

I'm designing a website and I have multiple pages that use the same template, some pages are longer than the browser window's height, other's aren't. The ones that are longer get pushed to he left by about 10px, this might no sound like much but it's noticeable when switching pages as everything jumps sideways.

Is there some CSS thing I can do to make the scroll bar on each page appear over the content rather tha开发者_如何学JAVAn pushing it, I have a margin in the template so if the browser window is too small it will just cover the margin when the user scrolls to the far right.

The only way to do this is to have the scrollbar always visible.

html { overflow-y: scroll; }

Give overflow value as overlay. This will avoid the recalculation of layout when scrollbar appears

Overflow: overlay worked for me. Would've commented on jintoppy's post but I'm a nooob