title: How Can I Center Bootstrap Tooltip in center of SVG
body: <p>Can you please take a look at this <a href="http://jsfiddle.net/Behseini/v8Z4a/2/" rel="nofollow noreferrer">JsFiddle</a> and let me know that how I can center the tooltip inside the SVG? I already see the same question on <a href="https://stackoverflow.com/questions/10727892/how-to-center-the-bootstrap-tooltip-on-an-svg">this post</a> but to be honest it was too confusing for me!</p>
  
  <p>Here is the code I have:</p>
  
  <pre><code>&lt;div class="container"&gt;
   &lt;div class="well"&gt;
    &lt;svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
   width="400px" height="400px" viewBox="0 0 400 400" enable-background="new 0 0 400 400" xml:space="preserve"&gt;
      &lt;ellipse class="firststar" cx="200" cy="200" rx="150" ry="150"/&gt;
     &lt;/svg&gt;
   &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and the jquery code:</p>
  
  <pre><code>$('.firststar').tooltip({title:'Test SVG Centering', container:'.well', placement: 'top'});
  </code></pre>