Thanks for the quick reply kobra - I felt stupid but happy that the answer was so simple.

I checked the barebones stylesheet expecting to have to alter the widths but they were both 900px!!

I have checked stylesheets in the barebones template and classic and template-default (because I don't know which ones might be causing this)

I assumed that the Barebones style sheet overirde all others?

in that stylesheet I have
/*wrappers - page or section containers*/
#mainWrapper {
background-color: #ffffff;
text-align:left;
width: 900px;x99%;

#headerWrapper {
margin: 0em;
padding: 0em;
width:900px;
height: 366px;/*adjust to suit*/
background-image: url(http://s p i c e z.com.au/shop/includes/templates/barebones/images/spicemixheader.jpg);
background-repeat: no-repeat;
}

I have put spaces between the letters of spicez, to avoid it being used as a link by search engines.

In firebug when I highlight the background picture I see

#headerWrapper, #contentMainWrapper, #logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #popupImage {
margin:0;
padding:0;
}
stylesheet.css (line 176)
#headerWrapper {
background-image:url(http://s p i c e z.com.au/shop/includes/templates/barebones/images/spicemixheader.jpg);
background-repeat:no-repeat;
height:366px;
margin:0;
padding:0;
width:900px;
}
stylesheet.css (line 166)
Inherited fromdiv#mainWrapper
#mainWrapper {
text-align:left;
}
stylesheet.css (line 158)
Inherited frombody#indexBody
body {
color:#111111;
font-family:arial,helvetica,sans-serif;
font-size:80%;
line-height:160%;
}

Is there another stylesheet that could override the barebones template stylesheet?

I am thinking there is some padding or margin coming into play here.

When I go to the shop the background displays correctly.
When I click on a category perhaps the category goes inside the shop wrapper and there's a margin/padding added?

hope you can help me find this problem