Left 'Margin' issue with CSS

[Juzman]

Hi,
I've been having real issues in trying to get my left margin (which is just a cell in a table) to display my graphic properly. You can see it at www.petwise.com.au (http://www.petwise.com.au). If you have a resolution of 1024x768 or if you just make the window smaller you will lose part of the right-hand-side of the margin (ie. the grey line and some of the colour will hide under the centered site). I need the left margin to remain fixed on the right-hand-side and lose the left portion of the image when making the window smaller (or at low resolutions).

You can see what I want on this site http://www.gamespot.com/.
I've tried using float: but to no avail

my current .css is

td.gutter-lft {
background-image: url(../images/sidebar_background2left.jpg);
background-repeat: repeat-y;
width: 140px;
height: 1px;
float:left
}
td.gutter-rgt {
background-image: url(../images/sidebar_background2right.jpg);
background-repeat: repeat-y;
width: 140px;
height: 1px;
}


Any help would be greatly appreciated
Justin