0

I am using Bootstrap-vue to show tool-tip. Works good but I can't increase width of tool-tip beyond a limit.

I found some related issues and discussions on github but couldn't resolve the issue.

I am not using sass or anything. I am simply importing TooltipPlugin from bootstrap-vue.

Also tried solution here setting

.tooltip .tooltip-inner{
  max-width: 500px !important;
  width: 400px !important;
}

does nothing. also tried setting --max-width: none; -- but no luck

How do I increase the width of tool-tip to make the content readable.

Mayank Kumar Chaudhari
  • 16,027
  • 10
  • 55
  • 122
  • Did you try the solution from here? https://github.com/bootstrap-vue/bootstrap-vue/issues/4950 – Flink May 27 '20 at 12:59
  • Yes I went through the solution but can't understand how to implement that in my case. – Mayank Kumar Chaudhari May 27 '20 at 13:25
  • Also tried setting css variable following this question - https://stackoverflow.com/q/41370741/9640177 – Mayank Kumar Chaudhari May 27 '20 at 13:26
  • 3
    Does this answer your question? [How to increase the width of the tooltip in Bootstrap-Vue](https://stackoverflow.com/questions/58819835/how-to-increase-the-width-of-the-tooltip-in-bootstrap-vue) – Hiws May 27 '20 at 13:48
  • The CSS logic is working fine for me. Please create a [small demo](https://stackoverflow.com/help/minimal-reproducible-example) for this using [codesandbox.io](https://codesandbox.io/s/vue) to show the issue happening. – palaѕн May 27 '20 at 14:44

0 Answers0