Browser's vertical scrollbar shifts layout

Hi everyone!

I have a problem with the design I'm working on.

I used this css grid as a basis to make the design more flexible: http://cssgrid.net/.

Most of the content of the website is not longer than a few lines but one of the pages contains a long text. The problem is that the browser automatically adds a scrollbar to the right which then moves the whole design to the left by a few mm. When you click the menu to go to another page, this shift looks quite stupid.

So far I thought of adding to the box that contains the layout. That of course removes the browser scrollbars but sort of defeats the point of the flexible layout as the height is now defined to fit my screen.

Another idea was to add

but that doesn't look good either.

What else can I do to prevent the shift? Thanks!

I use


This adds a permanent scrollbar. (and thus no shift)
Any other solution that tries to compensate with margins and stuff will not work due to the differences between operating systems (all have different scrollers). Unless you make your own scroll stuff with javascript

thanks a lot! works!

good to hear!