BetterTooltip plugin - CSS problem?

BetterTooltip plugin - CSS problem?

Hi,

I use the BetterTooltip - plugin to display some title-text when hovering an image.
Internet Explorer (7) is showing it just fine, but Firefox aligns the tooltip at the top of my page, while the image is somewhere 600-700px deep on the page.

The image is aligned in a table, behind some text and looks something like this:
  1. <img src="images/info.png" title="This is some text" class="abo-info" />

So when I hover it, a tooltip has to pop up saying "This is some text".

My script:
$(document).ready(function(){
      $('.abo-info').betterTooltip({speed: 150, delay: 100});
});

With following CSS for the tooltip:
  1. .tip {
  2. width: 360px;
  3. padding: 5px;
  4. display: none;
  5. position: absolute;
  6. margin -top: 56px;
  7. margin-left: 50px;
  8. color: #FFF;
  9. font-weight: bold;
  10. font-size: 12px;
  11. background-image: url(images/tooltip-bgr.png);
  12. padding-left: 15px;
  13. background-repeat: no-repeat;
  14. float: left;
  15. bottom: 0px;
  16. }

The class abo-info doesn' t really have much css. This is what it looks like now:
  1. .abo-info {
  2. cursor: pointer;
  3. display: absolute;
  4. margin-left: 5px;
  5. }
I' ve already tried without the absolute, and with a display: block: doesn' t work.

Thanks for helping me out here!