popover suddenly appearing away from the icon unless i change the value with interpolation

[ngingihy]

Bug description:

My application had a popover on an icon that used to work fine but after a certain deployment the icon it self moved away from its place, out of the container.

 <i class="btn  fa fa-star" id="star" popover="Favorite!" triggers="mouseenter:mouseleave" placement="left"
                    style="color: white;font-size: 25px;"
                    (click)="addFav()">
                    <ngx-spinner type="ball-spin-clockwise-fade"></ngx-spinner>

The thing is if i change the popover value to interpolation {{}} and read it from the. ts file, it work fine. So what could solve the issue.

I tried to add

         <i class="btn   fa fa-star"  popover="sssss" triggers="hover" placement="left"
                    style="color:rgb(219, 185, 32) ;font-size: 25px; 	position: absolute; top: 0;
                    left: 0 ;"
                    (click)="removeFav()">
                    <ngx-spinner type="ball-spin-clockwise-fade"></ngx-spinner>
                    </i>

` to the inline style but it moved it upwards but not to the same exact position. How can i fix this?

ngx-bootstrap: 10.2.0

Angular: 13.3.11

Bootstrap: 5.3.0

[paulswan]

You need to wind back to Bootstrap 5.2.3

[hakimio]

Or just add the following css to your global css file:

.popover, .popover-arrow { 
     position: absolute; 
 }

[lexasq]

Bootstrap above 5.2.3 isn't supported for now