Kent

I was working on a site (that shall remain nameless), and one of the goals was to have a nice background for one of the rows in the layout table. (yes. moving on.) I naively did this:

<tr class="fancyBackground"><td...

Where:

.fancyBackground { background-image:url('url-to-image.png');background-repeat:no-repeat;}

Unfortunately, IE interpreted it as though I had asked:

<tr><td class="fancyBackground"></td>
    <td class="fancyBackgound"></td>
    <td class="fancyBackgound"></td></tr>

Meaning that the background restarted with each new cell. Kent (and moreso Customer) not happy. The fix I used:

<tr><td class="fancyBackgoundNaughty"></td>
    <td class="fancyBackgoundInternet"></td>
    <td class="fancyBackgoundExplorer"></td></tr>

Where:

.fancyBackgoundNaughty{background-image:url('url-to-image.png');background-repeat:no-repeat;
background-position: 0px 0px; width:135px; }

.fancyBackgoundInternet {background-image:url('url-to-image.png');background-repeat:no-repeat;
background-position: -135px 0px; width:350px;}

.fancyBackgoundExplorer {background-image:url('url-to-image.png');background-repeat:no-repeat;
background-position: -485px 0px; }

Now you can all tell me how to do it 'correctly'. (I see at least one fix I coulda-shoulda-may do, but I still feel the same way about that browser. (And where's the IE8 CTP?)