On my webpage, I have lots of input fields, which are structured in rows and columns. I'm using the Blazority tooltip with some CSS adjustments to change the background-color and font-sizes, etc. to show some helper text about the input when the user hovers over the trigger next to my input label. This is a bespoke InputComponent I've built in my source repo. If my tooltip has alot of content, and consumes the maximum width I've displayed before breaking to a new line using the .word-wrap CSS prop, the content spills out of the page...
To reproduce
- Place a tooltip component to the right of your page, and declare the Position as
TooltipPosition.TopRight
Unfortunately, I cannot provide the source repo, but this should be relatively basic to reproduce.