Tooltip isn't showing where expected

[geoffreywk]

I have created a Plunk for this.
http://plnkr.co/3k00W03D9kjPWIzv1iS6

If you mouse over the first column, you'll see a tooltip appear, but not right below where the mouse is located. It appears over to the right. If you try to mouse over a column further down in the row you'll see the tooltip flash as it's trying to render, but appears to not be able to handle the large content in the tooltip.

As you can see by the sample, I'm trying to make a call queue screen. The large tooltip is because some queues are grouped (summed) together, but when the user mouses over that grouped queue they want to be able to see all the details about each queue that makes up that group.

In the Plunk the data is same for what's shown and what's in tooltip, just because wanted to simplify it.

Lastly, I will say that I am new to Bootstrap and AngularJS so could be something I'm doing wrong.

[wesleycho]

IMO, this seems like an abuse of tooltips - tooltips are meant to give contextual hints, not for full blown information overload. I would discourage this for UX reasons at the very least.

[RobJacobs]

The tooltip is positioned based on the element, not the mouse. The flashing should be addressed in master already under PR #4363 and will be refined by PR #4455. Closing for now, let me know if you feel these PR's do not address your issue and I will re-open.