title: textarea and vertical alignment inside a table
body: <p>We have a table with two columns: in each row there is a label on the left and an input box on the right.
  We use <code>vertical-align=text-bottom;</code> to align the bottom of the label text with the bottom of the text in the input boxes.</p>
  
  <p>So far so good.</p>
  
  <p>However, sometimes we have a textarea (multiple lines) instead of the input box. The bottom of the label on the left is aligned with the bottom of the <strong>last</strong> line of the textarea.</p>
  
  <p>Is there a way to align the text on the left with the <strong>first</strong> row of the textarea?</p>
  
  <p>A simplified example</p>
  
  <pre><code>&lt;table class="waiFormTable"&gt;
    &lt;tr&gt;
      &lt;td&gt;&lt;label&gt;Label 1:&lt;/label&gt;&lt;/td&gt;
      &lt;td&gt;&lt;input id="id" type="text" name="name" value="value" /&gt;&lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr&gt;
      &lt;td&gt;&lt;label&gt;Label 2:&lt;/label&gt;&lt;/td&gt;
      &lt;td&gt;&lt;textarea id="id" type="text" name="name" value="value" /&gt;&lt;/td&gt;
    &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>in the CSS we define:</p>
  
  <pre><code>table.waiFormTable thead tr,
  table.waiFormTable tbody tr {
    vertical-align: text-bottom;
  }
  </code></pre>
  
  <p>In this example I would like to have "Label 1:" text-bottom aligned with the first row of the textarea.</p>