title: How to get the relative position of an object inside a scrollable div?
body: <p><img src="https://i.stack.imgur.com/sEJym.png" alt="enter image description here"></p>
  
  <p>I have a scrollable div, the one on the left in the above image. 
  <br>In this div there exist many elements, lets focus on one of them (highlighted in grey) and call it A.</p>
  
  <p>The right image is a representation of the div with the full size (without scroll or width setting) where A is placed without scrolling.</p>
  
  <p>How may I find the value of X (in green), while having the left div currently on the page. <br>i.e. taking into consideration:</p>
  
  <ol>
  <li>The div on page is already resized  </li>
  <li>The div on page is scrollable (and has been scrolled) </li>
  <li>I want x not y !</li>
  </ol>
  
  <p>i.e. How to get the relative y coordinate of an element inside a scrollable div ?
  in simple words: how to calculate x via javascript ?</p>