title: How do i adjust the position of a Bootstrap's Tooltip for a certain element?
body: <p>I have these buttons/anchors right here and a Bootstrap made tooltip :</p>
  
  <pre><code>&lt;a id="btn1" class="mybutton" data-container="body" data-toggle="tooltip" data-placement="right" title="my tooltip"&gt;
      Hover Me To Display Tooltip
  &lt;/a&gt;
  
  &lt;a id="btn2" class="mybutton" data-container="body" data-toggle="tooltip" data-placement="right" title="my tooltip"&gt;
      Hover Me To Display Tooltip
  &lt;/a&gt;
  </code></pre>
  
  <p>and combine it with the jQuery code which is this :</p>
  
  <pre><code>$(document).ready(function(){
      $(".mybutton").tooltip();
  });
  </code></pre>
  
  <p>it will work perfectly fine, displaying the tooltip on the right.</p>
  
  <p>but how can i change the position of the tooltip of only button1 using CSS, so that i can move it further to the right? without moving the button2's tooltip?</p>