title: Vertically align a div within a table <th>
body: <p>I have a table header, <code>&lt;th&gt;</code>, that contains a <code>&lt;div&gt;</code> with text.  I want to <em>vertically</em> align the div such that it is aligned to the <em>bottom</em> of the header.  I am having serious trouble doing this even though it seems like it should be easy.  Any help would be great. </p>
  
  <p>i.e.</p>
  
  <pre><code>&lt;table&gt;
    &lt;tr&gt;
      &lt;th&gt;
        &lt;div&gt;T&lt;br&gt;E&lt;br&gt;X&lt;br&gt;T&lt;/div&gt;
      &lt;/th&gt;
      ...
    &lt;/tr&gt;
    ...
  &lt;/table&gt;
  </code></pre>
  
  <p>As you can see, I am making the header text vertical (by adding break tags).  The headers are being pulled dynamically and the lengths (and therefore the heights) vary.  But I need them aligned to the bottom rather than the center.</p>