Links and Image Links move down sometimes when active

Question

I have page with a bunch of links. The user is to click on the "Pick" link or the red X image. It works just fine.

However, sometimes, the "Pick" links and red X image move half-way down when active. This only happens when they are clicked on and active. In these images, I am clicking and holding on the links:

While just annoying visually, it also causes problems if a user is clicking on the top half of a link. The link moves down and they are no longer clicking the link.

The links are hidden and shown for each line using jQuery .show() and .hide() and the initial states are controlled with style="display:none" or nothing at all if visible.

Here's a sample row HTML:

<tr class="row-b"> 
    <td>&nbsp;</td> 
    <td>4:00 pm</td> 
    <td id="t39" rel="t3" name="t1867"><a href="/team/east/2010/">East</a></td> 
    <td><a href="#" name="1867" class="styled" rel="pick=39">Pick</a></td> 
    <td><a href="#" name="1867" class="styled" rel="delete=1867"><img src="/images/delete.png" height="12" width="12" /></a></td> 
    <td><a href="#" style="display:none" name="1867" class="styled" rel="pick=3">Pick</a></td> 
    <td class="hilite" id="t3" rel="t39" name="t1867"><a href="/team/creek/2010/">Creek</a></td> 
    <td>&nbsp;</td> 
</tr> 

It happens randomly (as far as I can tell) and on some while not on others at the same time, and doesn't happen initially.

Browser is not relevant; this happens in all 3 (IE, FF, Chrome). My users mostly use IE 7/8.

Any ideas on how to stop the links dropping?