In this case you can remove the Width property to resolve the issue. There are 2 correct ways of setting the Dimensions of the Tooltip:
1. Remove both the Height and Width properties so that the component will apply the required boundaries automatically. This is explained in the green Note at the end of this article:
2. Set both the Height and Width properties if you want to apply custom sizing to the component.
This is required because the tooltip is able to take its height dynamically only after its content is loaded on the client browser. This causes the height (bottom part) of the tooltip to expand in the Y axis direction (down) automatically to contain all the inner elements. And this works in the default case.
However, when the Position is set to be Top, the displaying of the Tooltip happens before the actual resizing/expanding. Since at the moment of showing of the Tooltip, its final height is still unknown, the calculation of the Top position ends up not being correct. To resolve that, you will need to set and return fixed Height if you want to have fixed Width.
Progress is here for your business, like always. Read more
about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.