title: I try to understand the translateY calculation using offsetHeight and clientHeight
body: <p>I try to fixate the last row of a table using translateY. It works now, but I do not understand the calculation difference shown below. And for the example: app.page = 'sections';</p>
  
  <pre><code>&lt;div class='table-scroll' style="overflow-y: auto;"&gt;
      &lt;table&gt;
          &lt;thead ...&gt;
          &lt;tbody&gt;
                &lt;tr.......
                &lt;tr class="scroll-end"&gt;
                 .....
                &lt;/tr&gt;
           &lt;/tbody&gt;
      &lt;/table&gt;
  &lt;/div&gt;                  
  </code></pre>
  
  <p>In this example:  </p>
  
  <pre><code>.scroll-table has a scrollHeight of 1169 and a clientHeight of 864  
  </code></pre>
  
  <p>I assumed I could do the first translateY (without scrolling) with: </p>
  
  <pre><code>864 - 1169 = -305 // .scroll-table.scrollHeight - .scroll-table.clientHeight
  </code></pre>
  
  <p>But I needed:   </p>
  
  <pre><code>.scroll-end has an offsetTop : 1105 and an offsetHeight : 47  
  </code></pre>
  
  <p>and calculating TranslateY using: </p>
  
  <pre><code>864 - 1105 - 47 = -288  // .scroll-table.scrollHeight - .scroll-end.offsetTop - .scroll-end.offsetHeight 
  </code></pre>
  
  <p>OK, but I do not understand the difference of 17 and why the first calculation fails to give me a good visible last row? I use Chrome.</p>