ToolTip not working in IE6

[jay123]

Hi,
I have been trying to make my tooltip work for IE6 but to no avail.

code is

<a class="info" href="#">
<img src="http://bytes.com/submit/Images/urgentblank.gif" class="icon"/>
<span>Data i need to show over hovered over link.</span>
</a>

and CSS is

.icon
{
	background: url(../abc.gif);
	height:25px;
	width:25px;
}
a.info
{
    position:relative; /*this is the key*/
    z-index:24;
    color:#000000;
    text-decoration:none
}

a.info:hover
{
    z-index:25;
}

a.info span
{
    display: none
}

a.info:hover span
{   /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    bottom:2em;
    left:2em;
    width:25em;
    border:none;
    background-color: #00517e;
    color:#ffffff;
    text-align: left;
    padding: 3px 5px;
}

Everything works fine IE7,IE8 and firefox but tooltip doesnt come in IE6.

Another question i have is what can i do so that when user clicks on <a> (this tooltip link), page dont do anything? right now, when user clicks on it. focus goes at top of page.(something like disabling click on <a> tag)

Thanks
Jay

[jay123]

Adding background-color to 'a.info span' class did the trick, God knows why :)

solution

a.info:hover
{
    z-index:25;
    [B]background-color:color-you-want;[/B]
}

But still looking for solution for disabling anchor tag, so user remains at same place when he clicks on <a> tag.

[jay123]

Changed <a> to <p>, sorted