Ok, so I own the site http://www.eClearly.com. And I have spent the last few weeks messing around in photoshop getting it to look nice and having everything I want. But to fit the new size of the image, I had to change the width of the main section. Now when it is viewed in Internet Explorer it shows up fine, but when it is viewed in firefox, the width of the main section is too wide. Also, in Internet Explorer, it seems that some of the image is cut off at the left.

The code that controls the width of the main section is in a file called stlye.css . This is the code:

#contenu{
background:url(images/content.jpg) repeat-y;
margin-left: -21px;
width: 825px;
padding: 0px 65px 0px 65px;
}


If anyone knows why this is happening and how I can fix it, let me know. Thanks.

a negative left margin will cause the image to cut off on the left..

Thanks, but what is causing the change in width when using different browsers?

i'm not entirely up on differences but ie and firefox seem to battle each other.. padding isn't always rendered properly in IE from what i have experienced in the past.

i found trhat using as little table elements as possible helps, and try to use divs where possible, unless you need tabular layout of course..

it's a big heartache matching firefox and IE, and it's more IEs fault than firefox..

check some opf the tables content widths and experiment. if you can on that theme try to use fixed width where necessary..