Incorrect Popover position

[Anntrick]

Hello

I have a problem when I try to use the popup, I just copied the sample code into a new component to test and the popup window is appearing lower than it should.

I've tried to solve by modifying the code by myself like I saw in other similar issues but that doesnt worked.

My component code is:

`

Toggle popover

Hello 🎉

<script> import Vue from 'vue'; import Popover from 'vue-js-popover' Vue.use(Popover); export default { } </script>

`

Thanks

[erashdan]

+1

[nunesdev]

+1

[fusionsquare]

+1

[melanke]

This problem happens when it is inside an element with position relative.

+1

[smilingkite]

See this issue: #27
It's still open after more than a year, so I think someone who is seriously good at stuff like this should look at it.
For some people it apparently works to simply use version 1.1.6 of this plugin. However, for me that doesn't position the popover correctly either.

[melanke]

Yea you are right, for now, I've made an workarround, with an position:absolute element around it with top and left setup.

I will consider fixing it on my free time.

[zangab]

is there any update regarding this issue?
i have a popover in a position fixed top-bar but as the popover positioning is beeing absolute and the scrolltop is ALWAYS added to the top positioning this won't work ... 😞

[zuobaiquan]

+1

[CharltonSantana]

Have you tried putting the popover inside a div with position relative (inside if the absolute positioned div)?

[dingyaguang117]

maybe vue-js-popover should use https://floating-ui.com/docs/computeposition to compute the position