Placement is not working

[michaelpelagio9830]

Hi I'm new to react-tooltip and I'm having a hard time why placement is not working
currently I'm using bootstrap classes. I set place="bottom" yet in my app the tooltip still on the right side. is there something I'm missing out? I would appreciate any help.

this is the output

I'm seeing the exact same issue. It seems if the element is snug to a left or right edge, the placement puts it on the opposite side instead of the top.

There must be some sort of dynamic calculation going on here that would need to be overridden.

Edit
There's definitely some complex logic trying to determine if the tooltip will end up placed outside the current viewport window, in which case it seems to recursively try the next placement until one is found where it fits.

I was able to fix my issue by reducing the overall size of the tooltip so that this calculation is avoided. Ensuring that the tooltip content and overall size is small enough, and the control its intended to call out far enough from the edges of the viewport, fixes the issue.

Better functionality would be for the tooltip position to be adjusted left or right depending on if its cut off for top/bottom placement. For left/right placement the width would probably be adjusted instead.

Another nice feature might be to just override this functionality with a prop. Something like forcePosition.