Please take a look at this jsfiddle
I gave position absolute to a question-sign icon with top:0; right: -42px;
therefore the element that shows tooltip is outside of row
. I think this has caused tooltip to not get proper width or misplace the tooltip content and tooltip content trapped within row-fluid
. as you can see arrow position is fine.
update: I'd place ?
icon next to textarea and textarea fill its parent width and aligned right. here is another example
How to position the tooltip - auto | top | bottom | left | right. When auto is specified, it will dynamically reorient the tooltip. When a function is used to determine the placement, it is called with the tooltip DOM node as its first argument and the triggering element DOM node as its second.
How tooltip is triggered - click | hover | focus | manual. You may pass multiple triggers; separate them with a space. 'manual' indicates that the tooltip will be triggered programmatically via the .
How To Create a Tooltip. To create a tooltip, add the data-toggle="tooltip" attribute to an element. Note: Tooltips must be initialized with jQuery: select the specified element and call the tooltip() method.
To create a tooltip, add the data-bs-toggle="tooltip" attribute to an element. Note: Tooltips must be initialized with JavaScript to work.
Specify body
as a container for a tooltip (demo):
$('[data-toggle="tooltip"]').tooltip({
container: 'body'
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With