title: Positioning a tooltip relative to another div in JQuery
body: <p>Here's my tooltips markup and CSS:</p>
  
  <pre><code>&lt;div class="tooltip"&gt;Click here to like it&lt;/div&gt;
  
  .tooltip {
      position: absolute;
      display: none;
      background: url('images/tooltip.gif') no-repeat;
      width: 100%;
      height: 40px;
      font-size: 0.8em;
      line-height: 40px;
      padding: 0px 0px 0px 8px;
  }
  </code></pre>
  
  <p>Now, I have a div on my page called <code>#button_container</code>. I would like to place this <code>.tooltip</code> div 150px to the right of that div via JQuery. I understand I need to set this tooltips <code>top</code> and <code>left</code> attributes, but not sure how.</p>
  
  <p>Idealy the tooltips <code>top</code> attribute should be the same as <code>#button_container</code> (although <code>#button_container</code> isn't positioned absolutely) and 150 less than <code>#button_container</code>'s <code>left</code> attribute.</p>
  
  <p>I don't really know where to get started on this so any help would be very much appreciated. Thanks.</p>