<p dir="auto">In v3.2.0 the behavior of how popovers are placed has changed. I have prepared two fiddles that showcase the difference:</p>
<ul dir="auto">
<li>Bootstrap v3.1.1 showing correct placement: <a href="http://jsfiddle.net/o89u6kn8/1/" rel="nofollow">http://jsfiddle.net/o89u6kn8/1/</a></li>
<li>Bootstrap v3.2.0 showing incorrect placement: <a href="http://jsfiddle.net/dthxt5ka/1/" rel="nofollow">http://jsfiddle.net/dthxt5ka/1/</a></li>
</ul>
<p dir="auto">Please notice that both fiddles share the same code. Only the Bootstrap version is different.</p>
<p dir="auto">See <a href="http://jsfiddle.net/hqDF7/" rel="nofollow">http://jsfiddle.net/hqDF7/</a> for a minimal example.</p>
<p dir="auto">The issue appeared with <a class="commit-link" data-hovercard-type="commit" data-hovercard-url="https://github.com/twbs/bootstrap/commit/8534e12523c7156b53e76393cc8d016ffdcf5b4f/hovercard" href="https://github.com/twbs/bootstrap/commit/8534e12523c7156b53e76393cc8d016ffdcf5b4f"><tt>8534e12</tt></a>.<br>
<a href="https://github.com/twbs/bootstrap/blob/v3.2.0/js/tooltip.js#L323-324">Those lines</a> use <code class="notranslate">.outerWidth</code> &amp; <code class="notranslate">.outerHeight</code> and override what <code class="notranslate">.getBoundingClientRect</code> was returning.  Unfortunately, <code class="notranslate">.outer[Width|Height]</code> always return 0 for SVG elements, while <code class="notranslate">.getBoundingClientRect</code> returns the expected output.</p>
<p dir="auto">Removing the incriminated lines "fixes" the issue.  But of course I guess it creates other issues.</p>
<p dir="auto">This issue is similar to <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="8486495" data-permission-text="Title is private" data-url="https://github.com/twbs/bootstrap/issues/5956" data-hovercard-type="issue" data-hovercard-url="/twbs/bootstrap/issues/5956/hovercard" href="https://github.com/twbs/bootstrap/issues/5956">#5956</a>.</p>