Some advice re webpages "shifting"

[Bluecube]

I've made up this website for my business. I'm happy with the design and look so I'm not asking for any help there. However, I've noticed that when navigating from page to page that there's a slight shift between the menu and main content. All the pages are produced from the same template page so I'm at a loss as to why there appears to be a size difference. Can anyone advise?

If anyone is going to look at the source code then be warned that while it's not untidy it was produced on Dreamweaver so is some junk code to make things slightly awkward.

Thanks in advance.

[Mblaster]

From having a quick look I'm pretty sure it's happening because some pages have a scroll bar and others don't. Because the main window is centred, adding the scroll bar on the right makes the window smaller, so shifts it's position to the left slightly.

[Bluecube]

Thought you might've been onto something there but no. If you move between Window Cleaning and Special Offers, both of which scroll (on my screen anyway) the shift still occurs.

[The_Wheelhouse]

Not in firefox it seems to be the scroll bar

all webpages with a scroll bar seem to be smaller than the ones without

[tonye]

Which browser are you using? As stated above it's probably due to the scrollbar or my reasoning a browser issue. In FF3.6 if I minimise my browser window so that all pages have a scrollbar, this 'shifting' is not apparent.

[Bluecube]

Apologies. It is indeed the scrollbar causing the shift. I followed tonye's advice and can see that no shift is apparent when all pages have a scrollbar.

Thanks all for your help.

[scaryjim]

If you want to stop it you can probably set the "body" element to always have a vertical scroll bar. Can't remember the exact CSS off the top of my head, but it's probably something like ... (ok, I didn't want to give rubbish advice so I looked it up) .. you can try body { overflow: scroll; } but that might not always show a scroll bar. Having looked through the CSS 2.1 documentation I'm not sure there is a way to force the page to show a scroll bar

[tiggerai]

If you want to stop it you can probably set the "body" element to always have a vertical scroll bar. Can't remember the exact CSS off the top of my head, but it's probably something like ... (ok, I didn't want to give rubbish advice so I looked it up) .. you can try body { overflow: scroll; } but that might not always show a scroll bar. Having looked through the CSS 2.1 documentation I'm not sure there is a way to force the page to show a scroll bar

The point being that if it doesn't have enough information to scroll - it won't.
Overflow says what to do when content exceeds the container size.

Usability would dictate that if there is a scrollbar then people would expect the page to scroll, if it doesn't it's deemed "broken".

Most people won't notice the shift, so I wouldn't worry about it too much unless it's causing a problem. Does it stop people using the site? No? Stop worrying about aesthetics then!

[oolon]

Pressure washing page looks a bit weird (if you have a wide window), due to the fact it is shorter than the left hand window. You might what to extend it so it always fills a page minimum. Also why does the pressure washer look so grumpy compared to the window cleaner? Did you pay him less!

[Bluecube]

Thanks again all. I'm a bit of a perfectionist and I don't like thinks not being "right"! I probably am going a bit OTT

The pressure washer is grumpier cause he only works in the rain whilst the window cleaner only really works in the dry. Now you know