title: Determining the height of an HTML table that is dynamically filled
body: <p>I would like to draw a diagram in HTML. The positioning structure looks like this:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;div id='hostDiv'&gt;
    &lt;div id='backgroundDiv'&gt;
      ... drawing the background ...
    &lt;/div&gt;
    &lt;div id='foregroundDiv' style='position: absolute;'&gt;
      ... drawing the foreground ...
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  <p>The foreground contains a Table element that is dynamically populated with text, hence the row heights might alter depending on the amount of text going into a cell.
  How can I predict the final height of the Table element in the foregroun? I need this information to set the correct height of the background. Is there a way to pre-render the Table from Javascript and read out its height? Or some other trick?</p>
  <p>PS. The size of the hostDiv may vary as the browser resizes.</p>