現在HTMLで↓のように

<body>
<div class="daruma"><div style="position:absolute;top:-20px;left:0px;">
<a href="リンク/"><img src="元の画像" border="0" onMouseOver="this.src='マウスオーバー時画像'" onMouseOut="this.src='マウスアウト時画像'" />
</a>
</div>

cssで↓のように

.daruma {
position: absolute; z-index: 2;
top: 0px;
left: 90px;
width: 96px;
height: 65px;
}

書いて画像リンクをしながらマウスオーバーをし、なおかつ位置を指定したいと思っているのですが、
リンク？の位置とマウスオーバー時の画像がずれてしまっているのか通常の画像しか表示されません。