Horizontal Scroll Bar Issue - On Smaller Screens

I'm working on http://www.lceonline.co.uk

When working on a smaller screen res, anything less than 1000px, I'm getting a hor开发者_如何学Goizontal scroll bar appear. This happens on all browsers.

I've tried

overflow-x : hidden;

but then the web pages' background doesnt repeat, it just seems to be one large gray background. It also is a css-3 property, One i'd rather try and avoid.

I've had a look at the sites' DIV tags and still cant see what is actually causing the problem. I havent built this from scratch, someone else worked on it before me and I feel they have used too many containers.

Can someone provide me with a possible solution on how to get rid of it?

Thanks

Your issue is that

#page-container and #page-container2 both have width:1000px;

If you remove the width from both of those the scrollbar disappears, as does the centring and the gray background.