How to adjust tooltip width

🌎 Discussion in English
1

Hi,

I don’t know much frontend development, specially css. How can I adjust the width of the tooltip?
<bs:Tooltip Position=“Top” Title=“Please enter the Company Reference Number if Required”>
<bs:TextBox Text=“{{value: OverViewList.ClientReference}}” maxlength=“10” Enabled=“{value: EditMode}” />
</bs:Tooltip>

Also another problem, how can I make the background color of tooltip to black? it turns out that it changes color when change the machine’s theme from light to dark mode or vice versa.
Here’s the code

                               <span data-bs-toggle="tooltip"
                                      data-bs-placement="right"
                                      title="Select the level of severity of the incident:

𝐇𝐚𝐳𝐚𝐫𝐝 - Something that could cause harm, injury or damage.
(i.e. forklifts sharing space with pedestrians, a damaged webbing strap, etc).

𝐍𝐞𝐚𝐫 𝐌𝐢𝐬𝐬 - An ‘event’ has happened that could have caused harm, injury or damage,
but did not (i.e. forklift turns next to a pedestrian and only just misses them,
a webbing strap breaks but the load doesn’t shift, etc).

𝐒𝐞𝐯𝐞𝐫𝐞 𝐈𝐧𝐜𝐢𝐝𝐞𝐧𝐭 - An ‘event’ has happened that has caused harm,
injury or damage, including potential legal action (i.e. forklift hits pedestrian,
a webbing strap breaks and load falls from vehicle hitting a car)."
style=“cursor:pointer; margin-left:6px; text-decoration:underline;color:black”>
      <i class="fa fa-info-circle"></i>
                                </span>
2

I am not using the bootstrap controls but if it is related to bootstrap, can’t you do it following their css variables customize guide?

.custom-tooltip {
--bs-tooltip-bg: var(--bd-violet-bg);
--bs-tooltip-color: var(--bs-white);
}