CODEWITHSUNDEEP
cssangularbootstrap-4popoverngx-bootstrap
rscherer
rscherer

Reputation: 913

Ngx-bootstrap popover positioning auto not working as expected on right side of screen?

I'm trying to implement some popovers on our application (Using Angular 6.0.1, Ngx-bootstrap 2.0.5 and Bootstrap 4.1.1), and the problem is that when using 'auto' positioning, some popovers on the right side of screen doesn't work as expected. Both Left and Center elements work as intended, placing the popover on top or right positioning, but the right side still sets it to 'top', and tries to resize the popover area.

Since a lot of our content is dynamic I don't have a way to determine when it's gonna happen and fix it like, for example, manually setting it to 'left'.

It would be nice if in this case the content could be on the left side of the button. Any other help or advice would be nice too.

I could not set a stackBlitz to work and show this bug, but we're generating the popover with the following code:

<button popoverTitle="Info" popover="auto auto auto auto auto auto" placement="auto" container="body" triggers="hover tap"> Right </button>

Left button works as expected, setting the content to right: enter image description here

Center button also works as expected, setting the content to top: enter image description here

But right button set it to top and tries to resize it (the content changes its size some times before standing still):

enter image description here

Upvotes: 3

Views: 4257

Answers (1)

Ambuj Khanna
Ambuj Khanna

Reputation: 1219

Did you tried [adaptivePosition]="true"

Not sure but it may help you because i faced similar issue and it works for me.

All The Best!!!

Upvotes: 1

Related Questions