How do i stop my website from moving from left to right when a new page is loaded?


I have a website that i am currently building and have 2 pages currently. Now im not sure whether this can be fixed with some html or css to why i have posted it here.

My design is coded up and the first page fills up the template so the user will have to scroll down. So its using up the whole browser height.

Now my second page is alot less in content so the page does not make use of the full height of the browser no need scroll bar is shown.

So when i click from one page to another it moves the page design with its content to one side.

I would like the website to be flush in design when clicking through links into the website i feel the problems lies with the browser height as one page is having to have a scroller whilst the other is not!

Ive had this issue for a while and never found a solution. My only solution was to add extra content or stretch the template design but i want to aviod doing this so would anyone know if there is a quick solution.


The problem is that some of the newer browsers dont show the scroll until they are required therefore moving the content across.

add the following to your css

html {

This will make the scrollbar appear all the time in all browsers.

tom you are a LEGEND !

many thanks for this, ive always wondered if there was a solution and it worked brilliantly!

thanks bro

no problem mate


That won’t work in Safari or Firefox,

The correct .css syntax is:

html {
overflow-y: scroll;