title: horizontal align in a div
body: <p>I have a box like this:</p>
  
  <pre><code>&lt;div id="selectBox"&gt;
  Select:
  &lt;select&gt;
  &lt;option&gt;1&lt;/option&gt;
  &lt;option&gt;2&lt;/option&gt;
  &lt;/select&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>How do i get them aligned so that they are horizontal in the middle of each other, the baseline of the "Select" text and the content of the select box ("1").(and not the box itself).</p>
  
  <p>I can solv this by wrapping a table around them and make two cells but i feel that method is very crude.</p>
  
  <p>Visual example of what i want: take a look at your top statusbar @stackoverflow. it has NAME | log out | about | faq SEARCHBOX. now: notice how the text is aligned TOP and the searchfield is middle(because it takes up that space). I want the text to be aligned middle :D my browser atm is IE7 </p>