Click to See Complete Forum and Search --> : Issue with a:hover


EbonComm
12-09-2008, 07:36 AM
I am trying to display a dynamic list in a hover box on my site. It works well in Firefox but I cannot get it show correctly in IE7.

You can look at the page at

http://support.eboncomm.com/index.php?component=account&module=clients&action=list and what I am talking about take place when you hover over the Users part of the row to show the names.

The html looks like:
<a class="tooltip" href="#">2<span class="tooltip"><ul><li><a href="www.google.com">Mike McCaffrey</a></li><li><a href="www.google.com">Phillip Mccaffrey</a></li></ul></span></a>

and the CSS is:
a.tooltip span {display:none; width: 180px; height: 50px; }
a.tooltip:hover span{display:inline; position:absolute; background:#ffffff; border:1px solid #cccccc; color:#6c6c6c;}

I am slightly new to CSS but if anyone can provide insight it will be a great help.

KDLA
12-09-2008, 10:03 AM
Add position: relative to the <a>.

Reference: http://psacake.com/web/jl.asp

optimus203
12-10-2008, 10:35 PM
KDLA, do you happen to ahve a Mac friendly link you would recommend for fixing this issue? Thanks in advance.

KDLA
12-11-2008, 08:17 AM
Since the technique is CSS, the platform of the machine doesn't matter.