Struggling with Bootstrap customization for tooltips here. My goal is to widen the tooltips and give them a personalized background color along with text color.
I've experimented with various techniques but none seem to achieve the desired outcome. Any experts in tooltip customization within Bootstrap4? Most guides I found were tailored to Bootstrap 2 or 3.
This Photoshop-designed tooltip is what I'm aiming for: Desired Tooltip Look. Currently, it looks like this: Current Tooltip Appearance
The code snippet I've been using so far (omitting SCSS due to lack of success):
<h1 data-toggle="tooltip" title=" example">MENU LUX</h1>
$(function() {
$('[data-toggle="tooltip"]').tooltip();
});
Css:
.tooltip {
border-color: rgb(151, 151, 151);
background-color: rgb(151, 151, 151);
color: black;
}