Multiple Background Images

I’m trying to use two background images to create a bar at the top and bottom of my page using CSS. I read you can list background images, but it’s not working for me. This is the code I’m using that won’t work:

body {
background: #FFFFFF;
background-image: url(images/bg.gif), url(images/bg1.gif);
background-repeat: repeat-x, repeat-x;
background-position: top left, bottom left;
background-attachment: scroll;
width: 960px;
color: #1B2C33;
font-size: 12px;
font-family: Georgia;
margin: 0px auto 0px;
padding: 0px;
}

However, listing one background image works like this:

body {
background: #FFFFFF;
background-image: url(images/bg.gif);
background-repeat: repeat-x;
background-position: top left;
background-attachment: scroll;
width: 960px;
color: #1B2C33;
font-size: 12px;
font-family: Georgia;
margin: 0px auto 0px;
padding: 0px;
}

Anyone have any idea why listing two images isn’t working for me?