Horizontal scrollbar appears, tooltip is cropped
moroshko opened this issue · 2 comments
moroshko commented
Describe the bug
Think of a menu that has items in it. One of the items is disabled and has a tooltip using react-popper-tooltip.
The menu is positioned absolutely. (and, this is something I cannot change since it's coming from a 3rd party library @szhsin/react-menu)
The undesired effect that occurs is that a horizontal scrollbar appears and the tooltip appears to be cropped.
To Reproduce
CodeSandbox
Expected behavior
No horizontal scrollbar, the tooltip is fully visible:
Desktop (please complete the following information):
- OS: iOS 12.1
- Browser: Chrome 100
- Version: 4.3.1
denisborovikov commented
To resolve this issue you have to move the tooltip outside of the parent container. See our demo section - Using with react portal.
moroshko commented
Perfect, thanks a lot!