I have to apply tooltip in various pages in reactive web, so instead of changing css for every tooltip, is there any way by which the tooltip text will get adjusted automatically according to text?
Hello!! @Aditya Chinchole , can you share why you are saying that the tooltip is not adjusted automatically?
For example, i have an example of the tooltip, that is adjusting my content, and I am using OutSystems UI
Regards,
Márcio C.
This is the issue, u can notice that the width remains same for long messages, which doesn't look good to the user. I am looking for automatic width management as per content @Marcio Carvalho
As you can see, it as a min width,
if you put the width 100%
it will be 100% through the screen
So, what you can do is, create a block called custom tooltip where you can put in a static/dynamic way the width you want on that screen!! :)
https://marcio-carvalho4.outsystemscloud.com/exemplo2/Screen1?_ts=637551208349261959
Hi Aditya Chinchole,
https://vani-mankad.outsystemscloud.com/Reactive_POC/Screen2?_ts=637551223401736138
Please have a look, Tooltip is adjusting as per the content. have a look attached oml as well.
let me know which control you are using ?
Thanks,
Vani
Hello @Vani Mankad can you please put the screen as anonymous?
Done - Please download now and check for refrence.
Thank you :)
ok ok many thanks :D
The width is not changing for long messages. It won't adjust that text in one line. that is what I want @Vani Mankad
Hi Aditya,
For the mentioned use-case, you can try to override the pre-defined tooltip-wrapper style class (or chain a custom class) with the below-mentioned CSS class defintion.
.tooltip-wrapper { min-width: max-content; }
See this sample screen
Hope this helps you!
Kind regards,
Benjith Sam
Can you please share the oml file?
The answer of @Benjith Sam!