I noticed a bug in the positioning of beauty tips when using it with the Bartik theme in Firefox 12. Maybe this is related to #1229662: Beautytips not working in Mozilla Firefox, I'm not sure.

The problem is that the tooltip is not positioned next to the trigger element, but at the bottom of the page. Also, it has no spike.

Digging in the source code with firebug, I found out that the problem lies in div#content, which was a distant parent (some 20 levels up) of the beauty tip element. The div#content element has the following CSS rules applied to it:

.no-sidebars #content {
    float: none;
    width: 960px;
}

#content, #sidebar-first, #sidebar-second, .region-triptych-first, .region-triptych-middle, .region-triptych-last, .region-footer-firstcolumn, .region-footer-secondcolumn, .region-footer-thirdcolumn, .region-footer-fourthcolumn {
    display: inline;
    float: left;
    position: relative;
}

The cause seems to be the combination of the display, float and position properties. The problem disappears when I make one of the following changes in firebug:
- change float: none to float: left, or
- change display: inline to display: block, or
- change position: relative to position: static.
By the way, none of these changes have an effect on the lay out.

I'm not sure if this should be considered a bug in Beauty Tips, Bartik or in Firefox. At least, I hope this helps anyone with similar problems.

Comments

miccelito’s picture

I notice the same position (css) issue using firefox with beautytips

kongoji’s picture

I have the same problem, it works on all other browsers but Firefox

weseze’s picture

Same problem on Chrome. Really annoying...

miccelito’s picture

Solution in my case was to add (css):

/*##beautytips position fix for firefox##*/
body.gecko div#content { 
	position:static;
}

Note:
There is a "gecko" class since I use CSS Browser Selector http://drupal.org/project/css_browser_selector

pikot’s picture

#4 Thanks, worked for me!

dmundra’s picture

Still a problem in Firefox and #4 worked for me as well.

  • pifagor committed fe39668 on 7.x-2.x
    Fixed codding standarts. Fixed errors #1902324 and #1563688.
    
pifagor’s picture

Status: Active » Fixed

Done

pifagor’s picture

Status: Fixed » Closed (fixed)