Qtip basic problem

Question

Hi,

This is how the script looks lile :

$(document).ready(function () {
    $('#MyDiv').qtip({
        content: 'I\'m at the top right of my target',
        position: {
            corner: {
                target: 'topRight',
                tooltip: 'bottomLeft'
            }
        }
    });
});    

And this is how the html looks like :

<div id="MyDiv">This is my Text</div>

There is no css bound to the MyDiv element. The div element is placed within the Begin form tag.

The problem is that the tooltip will appear far to the right (not even near the div)?

The documentation show that this should work so why is it not?

BestRegards

Answer 1

You need to specify a CSS width for your MyDiv element. Qtip is putting the tooltip at the top-right corner of this div and the div is extending width-wise to fill the element it's contained in.

Use Firebug (with Firefox) or developer tools (with Internet Explorer) to look at your element's dimensions and you should see this.