Hello,

I tried to display a image when a mouseover on text occurs. It works fine. And the alignment of the image should be shown such that the end of the image should be at the container. It works fine with the code shown below, Only in IE7. In everything, it gets chopped off.. What is wrong here?

<td valign="middle" class="table_td td" style="width: 347px">
   <span class="feature_text" style="cursor:pointer" 
   onmouseover="ShowPicture('Style16',1)" 
       onmouseout="ShowPicture('Style16',0)" id="a16">
               Storefront Window Decal</span>
    <div id="Style16" style="position:relative;height:0px;left:50%;bottom:700%;
        visibility:hidden; border:solid 0px #CCC; padding:5px">
        <img src="images/window-decal-image.gif"></div> 

<script language="javascript" type="text/javascript">
 function ShowPicture(id,Source) 
 {
    var vis, elem;
    if (1 == Source)
    {
         vis = "visible";
    }
    else if (0 == Source)
    {
       vis = "hidden";
    }
    else
    {
       throw new RangeError("Unknown Flag");
    }

    if (elem = document.getElementById(id))
    {
       elem.style.visibility = vis;
    }
    else
    {
       throw new TypeError("Element with id '"+id+"' does not exist.");
    }
    return vis;
}
</script>

Can someone help me out. Thanks in advance!!