views:

157

answers:

1

http://betawww.helpcurenow.org/media/press/

You'll see I have used spans within an anchor, with the span.hover-description set to display:none; by default, and on a:hover that span is set to display block and absolutely positioned to create a tool-tip effect when hovering over the name and email of the "For Immediate Release" contact names.

Everything looks as desired in Firefox, but Chrome reveals my unknown blunder somewhere.

Any help on what's the problem that is causing Chrome to not display like Firefox?

Incidentally, Explorer shows the tool tip as expected, although I'm getting a funky bottom margin issue below the names, and Safari has the same issue as Chrome (must be a webkit rendering setting that I need to accommodate for).

A: 

OK, I figured it out. Since I'm using a pretty complex nesting structure to accomplish the CSS tool-tips, I overlooked the fact that I had actually nested a p tag within a p, and of course that is a no-no.

Firefox is really friendly to a lot of validation errors, but Chrome and Safari seem to be much more strict.

In the end I changed the p's to span elements and all is well across browsers.

JAG2007
I would recommend getting the HTML Validator extension, because it would have shown you that error instantly.
Waleed Al-Balooshi