FontAwesome 5 bootstrap tooltip issue producing two tooltips

Question

I faced issue of getting two tooltips instead of one while using FontAwesome 5 as It will create additional SVG tag with bootstrap tooltip. I even disable the tooltip everywhere for bootstrap tooltip but still I was getting undesired tooltip.

Issue can be reproduced with following code

<span                
           class="fa fa-question-circle"
           data-toggle="tooltip"
           data-placement="right"
           title="Some Title"
           data-tt-head="Some Header"
           data-tt-footer="<a style='opacity: 70%' target='_blank' href=''>Read More ... 
</a>" >
</span>

Answer 1

This issue was solved following the solution by @serghost found in link below using a wrapper for the tag instead using it with in same tag.

https://github.com/FortAwesome/Font-Awesome/issues/11902

<span                
           data-toggle="tooltip"
           data-placement="right"
           title="Some Title"
           data-tt-head="Some Header"
           data-tt-footer="<a style='opacity: 70%' target='_blank' href=''>Read More ... 
</a>" >
<i class="fa fa-question-circle"></i>
</span>