Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Some tooltip and popover placements are not working as intended #4369

Closed
Seveilith opened this issue Aug 4, 2022 · 3 comments · Fixed by #4564
Closed

Some tooltip and popover placements are not working as intended #4369

Seveilith opened this issue Aug 4, 2022 · 3 comments · Fixed by #4564

Comments

@Seveilith
Copy link

Bug description:

Placements other than top, bottom, left and right are not working as intended for the popover and tooltip components.
For instance, if you specify top-left, then the placement will be the same as top.

Note, I've also tried other directional properties such top-start in favor of top-left, which also resulted in the same outcome as above.

It was last working in v11:
https://stackblitz.com/edit/angular-h4rwfs?file=src%2Fapp%2Ftooltip-basic.html

Link to minimally-working StackBlitz that reproduces the issue:

https://stackblitz.com/edit/angular-d7cxo4?file=src%2Fmain.ts,src%2Fapp%2Ftooltip-basic.html

Versions of Angular, ng-bootstrap and Bootstrap:

Angular: 14.1.0

ng-bootstrap: 13.0.0

Bootstrap: 5.20

Popper: 2.10.2

@fbasso
Copy link
Member

fbasso commented Aug 4, 2022

Thanks for reporting an issue, @Seveilith.

Interesting. I didn't understand what's happen yet, but I noticed it works in this use case:
https://stackblitz.com/edit/angular-ab99w7?file=src%2Fapp%2Ftooltip-autoclose.html

@bamboechop
Copy link

Any update on this? Did some investigation happen? I've encountered this exact issue after updating from v11 to v14 during a big dependency update to get a project up to date again and now I get complaints that the tooltips look wrong.

@maxokorokov maxokorokov added this to the 15.1.2 milestone Aug 31, 2023
@bastienmoulia
Copy link
Contributor

bastienmoulia commented Sep 2, 2023

Stackblitz updated
image
https://angular-pmqwdh.stackblitz.io

maxokorokov added a commit to maxokorokov/ng-bootstrap that referenced this issue Sep 11, 2023
Bootstrap doesn't have `top-left`, `top-start` composite placements and it leaves the padding that interferes. This commit removes the padding.

Fixes ng-bootstrap#4369
maxokorokov added a commit to maxokorokov/ng-bootstrap that referenced this issue Sep 12, 2023
Bootstrap doesn't have `top-left`, `top-start` composite placements and it leaves the padding that interferes. This commit removes the padding.

Fixes ng-bootstrap#4369
maxokorokov added a commit that referenced this issue Sep 13, 2023
Bootstrap doesn't have `top-left`, `top-start` composite placements and it leaves the padding that interferes. This commit removes the padding.

Fixes #4369
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants