Here is what i did and it's looks really weird. Let me know what i'm doing wrong. <html><head><style type="text/css">#dhtmltooltip{position: absolute;width: 150px;border: 2px solid black;padding: 2px;background-color: lightyellow;visibility: hidden;z-index: 100;/*Remove below line to remove shadow. Below line should always appear last within this CSS*/filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135);}</style><style type="text/css">h1{text-align: left;color: yellow;font-family: arial} h2{text-align: left;color: green;font-family: arial} h3{text-align: left;color: black;font-family: arial} h4{text-align: left;color: blue;font-family: arial} </style></head><body><div id="dhtmltooltip"></div><script type="text/javascript">/************************************************ Cool DHTML tooltip script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)* This notice MUST stay intact for legal use* Visit Dynamic Drive at [url="http://www.dynamicdrive.com/"]http://www.dynamicdrive.com/[/url] for full source code***********************************************/var offsetxpoint=-60 //Customize x offset of tooltipvar offsetypoint=20 //Customize y offset of tooltipvar ie=document.allvar ns6=document.getElementById && !document.allvar enabletip=falseif (ie||ns6)var tipobj=document.all? document.all["dhtmltooltip"] : document.getElementById? document.getElementById("dhtmltooltip") : ""function ietruebody(){return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body}function ddrivetip(thetext, thecolor, thewidth){if (ns6||ie){if (typeof thewidth!="undefined") tipobj.style.width=thewidth+"px"if (typeof thecolor!="undefined" && thecolor!="") tipobj.style.backgroundColor=thecolortipobj.innerHTML=thetextenabletip=truereturn false}}function positiontip(e){if (enabletip){var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;var curY=(ns6)?e.pageY : event.clientY+ietruebody().scrollTop;//Find out how close the mouse is to the corner of the windowvar rightedge=ie&&!window.opera? ietruebody().clientWidth-event.clientX-offsetxpoint : window.innerWidth-e.clientX-offsetxpoint-20var bottomedge=ie&&!window.opera? ietruebody().clientHeight-event.clientY-offsetypoint : window.innerHeight-e.clientY-offsetypoint-20var leftedge=(offsetxpoint<0)? offsetxpoint*(-1) : -1000//if the horizontal distance isn't enough to accomodate the width of the context menuif (rightedge<tipobj.offsetWidth)//move the horizontal position of the menu to the left by it's widthtipobj.style.left=ie? ietruebody().scrollLeft+event.clientX-tipobj.offsetWidth+"px" : window.pageXOffset+e.clientX-tipobj.offsetWidth+"px"else if (curX<leftedge)tipobj.style.left="5px"else//position the horizontal position of the menu where the mouse is positionedtipobj.style.left=curX+offsetxpoint+"px"//same concept with the vertical positionif (bottomedge<tipobj.offsetHeight)tipobj.style.top=ie? ietruebody().scrollTop+event.clientY-tipobj.offsetHeight-offsetypoint+"px" : window.pageYOffset+e.clientY-tipobj.offsetHeight-offsetypoint+"px"elsetipobj.style.top=curY+offsetypoint+"px"tipobj.style.visibility="visible"}}function hideddrivetip(){if (ns6||ie){enabletip=falsetipobj.style.visibility="hidden"tipobj.style.left="-1000px"tipobj.style.backgroundColor=''tipobj.style.width=''}}document.onmousemove=positiontip</script><a href="http://www.yahoo.com" onMouseover="ddrivetip('<table width="200" border="1" bgcolor="#000000"><tr><td><h1>Weak Troll's Blood Potion</h1><br><h2><u>Use:</u>Regeneration</h2><br><h3>Cooldown: 3 sec</h3><br><h3>Charges: 1(expandable)</h3><br><h3>Item Level 8</h3><br><h4>Source:Recipe,Vendor,Quest</h4></td></tr></table>')"; onMouseout="hideddrivetip()">Search Engine</a></body></html>
