Need help overlapping

All of the posts I can find about overlapping are how to cure it and not how to make it happen so excuse me if this question has been visited.

I have a graphic - a 20 pixel round bullet point. I have single lines of text in divs with spacer divs betwee each (22 pixels high no contents). The single lines of text are each inside their own #banner div for a silver background. The 20 pixel bullets are trans png files. I need the 20 pixel bullet to land so that the right half is over the 14 pixel tall div and the left half has none of the silver background of the #banner div.

I have tried margins and div width with overflow: visible. Any clues? It's got to be simple - I'm just code blind right now.

consider positing your code.

Here is a small example

<table cellspacing="0" cellpadding="0" style="border: 1px solid black;">
<tr>
<td><div style="position: relative; top: -5px; width: 100px; height: 100px; border: 1px solid black; background: url('images/Image1.jpg');"></div>
</td>
<td>ghghfh</td>
</tr>
<tr>
<td>gfhfh</td>
<td>fhfghfh</td>
</tr>
</table>