title: How can I make elements arranged in a horizontal StackPanel share a common baseline for their text content?
body: <p>Here's a trivial example of the problem I'm having:</p>
  
  <pre><code>&lt;StackPanel Orientation="Horizontal"&gt;
      &lt;Label&gt;Foo&lt;/Label&gt;
      &lt;TextBox&gt;Bar&lt;/TextBox&gt;
      &lt;ComboBox&gt;
          &lt;TextBlock&gt;Baz&lt;/TextBlock&gt;
          &lt;TextBlock&gt;Bat&lt;/TextBlock&gt;
      &lt;/ComboBox&gt;
      &lt;TextBlock&gt;Plugh&lt;/TextBlock&gt;
      &lt;TextBlock VerticalAlignment="Bottom"&gt;XYZZY&lt;/TextBlock&gt;
  &lt;/StackPanel&gt;
  </code></pre>
  
  <p>Every one of those elements except the <code>TextBox</code> and <code>ComboBox</code> vertically position the text they contain differently, and it looks plain ugly.  </p>
  
  <p>I can line the text in these elements up by specifying a <code>Margin</code> for each.  That works, except that the margin is in pixels, and not relative to the resolution of the display or the font size or any of the other things that are going to be variable.</p>
  
  <p>I'm not even sure how I'd calculate the correct bottom margin for a control at runtime.</p>
  
  <p>What's the best way to do this?</p>