Mouseover show text description

Hi,

I have a link and when i mouseover, i want it to show the text description, i can do title="....", but i have alot of information want to display, so title it not my option.  I've tried  many diffrent codes but it was woking in both IE and firefox.  I've found it from google, it lookssample but it is not working on IE when copy the code over.  Is any one knows any code works in both IE and firefox?

<

style>

span

.dropt {border-bottom: thin dotted; background: #ffeedd;}

span

.dropt:hover {text-decoration: none; background: #ffffff; z-index: 6;

}

span

.dropt span {position: absolute; left: -9999px;

margin: 20px 0 0 0px; padding: 3px 3px 3px 3px;

border-style:solid; border-color:black; border-width:1px; z-index: 6;}

span

.dropt:hover span {left: 2%; background: #ffffff;}

span

.dropt span {position: absolute; left: -9999px;

margin: 4px 0 0 0px; padding: 3px 3px 3px 3px;

border-style:solid; border-color:black; border-width:1px;}

span

.dropt:hover span {margin: 20px 0 0 170px; background: #ffffff; z-index:6;}

</

style>

span class="dropt" title="Title for the pop-up">Hot Zone Text

<span style="width:300px;">Pop-up text</span>

</

span>

thanks

KT