CSS background: trouble

[Antivirus]

Having trouble getting two different images into a custom CSS declaration. I have the following:
/* ***** ERC styling for art headings ***** */
.ercarthead {
background: #333333 url(images/gradients/erc_bighead_gradient.gif) repeat-x top left;
color: #FFFFFF;
font: bold 32px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
text-transform: uppercase;
padding: 0px 0px 1px 4px; }


which works nicely and shows my gradient, however I am looking to place another image in the same background declaration like this (but it fails to show)...
/* ***** ERC styling for art headings ***** */
.ercarthead {
background: #333333 url(images/gradients/erc_bighead_gradient.gif) repeat-x top left, url(images/gradients/erc_subhead_o.gif) no-repeat top right;
color: #FFFFFF;
font: bold 32px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
text-transform: uppercase;
padding: 0px 0px 1px 4px; }


what am i doing wrong? hopefully someone out there can tell me? :)

[Behemoth]

You can't do that.

What exactly was it you were trying to do? I may be able to help you.

[Antivirus]

I am trying to get the second image to display above the repeating first image. Each image works correctly on it's own, but when trying to use both at same time, onle 1 works, the other does not.

[Princeton]

as stated, you can't do that...
you could nest divs (if you are using divs)
or add a background image to <tr> and another to <td> if you are using tables

[Antivirus]

Figured out how to do it- had to keep the repeating gradient within the .ercarthead css, then within the html, I used "float" on the image i wanted to have on the right:

<td class="ercarthead" width="489">
<div style="float:right;"><img src="$vboptions[bburl]/images/gradients/erc_subhead_o.gif" border="0" /></div>
$content
</td>

[Behemoth]

Figured out how to do it- had to keep the repeating gradient within the .ercarthead css, then within the html, I used "float" on the image i wanted to have on the right:

<td class="ercarthead" width="489">
<div style="float:right;"><img src="$vboptions[bburl]/images/gradients/erc_subhead_o.gif" border="0" /></div>
$content
</td>

Oh, that's what you were trying to do. I thought you meant overlaying two different backgrounds over one another, which is impossible without using layers.