Hi,

Sorry for not describing the second point deep enough.

I have added the following CSS at the bottom of the App.vue in order to prevent the pointer events inside of the two primary buttons:

<style>
.bi-app-indicator {
  pointer-events: none;
}
</style>

And here is the definition of the Tooltip:

  <Tooltip
      :anchor-element="'target'"
      tooltipClassName="shadow-sm"
      :setCalloutOnPositionAuto="'50%'"
      :parentTitle="true"
      :position="'bottom'"
    >

https://stackblitz.com/edit/vue-nfx4ya?file=src%2FApp.vue

If we don't add this CSS the tooltip will hide and then again appear when having the inner icon - so you can choose which behavior suits you better.

If we want to have tooltip centred even when we remove the label we also have to set some position as 'bottom' for example - otherwise the tooltip is position with 'auto' as it is explained in 1). 

If you have further questions or still observe unusual behavior please let us know again so we could inspect it once again.

Regards,
Plamen
Progress Telerik

Hello,

By default the position of the tooltip is 'auto' and in this case it is positioning itself so that is is visible on the screen. Having this in mind this positioning is expected with this setting. If we want to position the tooltip so that it is pointing the icon we can set the position to 'bottom' for example - :position="'bottom'" - https://stackblitz.com/edit/vue-faurrm?file=src%2FApp.vue

If we have an internal item and we don't want it to be different than its parent we ca add the pointer-events: none; to the child element as for example it is done in this example - https://stackblitz.com/edit/vue-xkmrkn?file=package.json,public%2Findex.html,src%2FApp.vue

Regards,
Plamen
Progress Telerik