title: Trying to right-align a pop-up element in Javascript
body: <p>I am trying to align pop-up elements in a header element in a table. Eventually the pop-up elements will provide functionality like sorting and filtering for my table. </p>
  
  <p>Per default the pop ups align themselves to the <strong><em>left</em></strong>, but I would like to align them to the <strong><em>right</em></strong> :</p>
  
  <p><img src="https://i.stack.imgur.com/WVdPr.png" alt="enter image description here"> </p>
  
  <p>My CSS code looks like something like this :</p>
  
  <pre><code>.Table .Popup {
      position:absolute;
      z-index:9999;
  }
  </code></pre>
  
  <p>I would like to use the <strong>relative</strong> position instead of <strong>absolute</strong> (ie.relative to the header item), but I am not sure how. If I use absolute, doesn't that interfere with any other parent containers that have position set to absolute?</p>
  
  <p>JSFiddle : <a href="http://jsfiddle.net/XJXuR/9/" rel="nofollow noreferrer">http://jsfiddle.net/XJXuR/9/</a></p>
  
  <p>Does anyone know how this can be done? JQuery or Javascript is fine. Thx.</p>